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

• 2021 年 1 月 22 日
• 筆記

前端公眾號授權

公眾號設置

0、首先用IIS創建一個空目錄的網站用於公眾號域名驗證，接著把該網站內網穿透出去，推薦用utools工具，官網：//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 = `//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();
}