基於.net5 wtm框架、uni-app微信公眾號開發一、公眾號授權

稻草人2013發表於2021-01-22
框架APP

前端公眾號授權

公眾號設定

0、首先用IIS建立一個空目錄的網站用於公眾號域名驗證，接著把該網站內網穿透出去，推薦用utools工具，官網：https://u.tools/ 下載安裝好後搜尋內網穿透並做好配置
給一張配置好的圖
1、進入公眾號管理後臺：開發-基本配置，把公眾號開發資訊裡對的AppSecret、IP白名單設定好（記得儲存好AppSecret因為配置好後會不可見）
2、進入公眾號後臺選單：開發-介面許可權-網頁授權-網頁授權獲取使用者基本資訊-修改，配置好業務域名、JS介面安全域名、網頁授權域名（配置域名填寫域名目錄的話，只有該目錄下生效，並不是該域名所有目錄生效，例如：配置www.qq.com/wx，那麼www.qq.com和www.qq.com/qq都不會生效）

公眾號授權

看了官方的文件，我們都知道，公眾號授權有兩種方式，一種是靜默授權，使用者無感知，但無法獲取使用者的基礎資訊，如果要想拉取到使用者資訊，則需要使用另一種授權方式，由於這種方式涉及到隱私，所以需要使用者同意才行。

// 新建util.js
export default {
	wxAuthorize() {
		let link = window.location.href;
		let params = this.getUrlParams(link);  // 地址解析
		   // 已經授權登入過的就不用再授權了
		//if (store.state.token) return;

		// 如果拿到code，呼叫授權介面，沒有拿到就跳轉微信授權連結獲取
		if (params.code) {
			 // 呼叫後臺介面，授權
		} else {
			let appid = '公眾號的appid';
			let uri = encodeURIComponent(link);
			let authURL = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${uri}&response_type=code&scope=snsapi_userinfo&state=123#wechat_redirect`;
			window.location.href = authURL;
		}
	},
	
	getUrlParams(name) {
	    var params = {};
	    location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi, function (str, key, value) {
	        params[key] = value;
	    });
	
	    return params[name] || params;
	}
}

// 在main.js引入util.js
import util from "./util/util.js"
Vue.prototype.util = util

// 在App.vue中的啟動方法中開啟授權，開啟任意頁面都會獲得授權
onLaunch: function() {
	console.log('App Launch');
	this.util.wxAuthorize();
}

相關文章