公眾號網頁獲取微信授權

自定義網站放在公眾號里面進行微信授權

官網地址：https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html

其實官方文檔做就可以，只是有些地方寫的不是很貼切，所以來寫這個

配置：

1.首先需要先去配置在公眾號設置你網站部署的域名，
填寫的是域名（是一個字符串），而不是URL，因此請勿加 http:// 等協議頭。

2.授權回調域名配置規范為全域名，比如需要網頁授權的域名為：www.qq.com，配置以后此域名下面的頁面http://www.qq.com/music.html 、 http://www.qq.com/login.html 都可以進行OAuth2.0鑒權。但http://pay.qq.com 、 http://music.qq.com 、 http://qq.com無法進行OAuth2.0鑒權。

有兩種授權方式：

區別就是一種需要用戶來授權 一種不需要就是轉一下
官網寫的也很清楚：

使用

舉例子： 這是其中一種，需要用戶的授權的那種 需要另一種的 根據下圖該參數就行了

      var url = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=你自己的APPID&redirect_uri=授權完要去的頁面&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect'
window.location.href = url

解釋：就是你點擊登錄的時候打開跳轉這個連接就會實現授權操作，授權完成后，你需要的數據就會以URL的方式跳轉到你寫好的目錄去 例如：http://localhost:8081/index?code=081ibxFa1CCeFB0ooiHa1cThA40ibxFQ&state=STATE 然后解析就能得到code

解析:

貼心的我准備了js解析URL的方法

    transform(str) {
      // 創建目標對象
      let $_REQUEST = new Object,
          // 截取數據字符串
          data = str.slice(str.indexOf("?"), str.length - 1),
          // 將數據字符串表現為數組
          aParams = data.substr(1).split("&");
      //console.log(data);
      //console.log(aParams);
      for (let i = 0; i < aParams.length; i++) {
        // 數據屬性與數值分離
        let aParam = aParams[i].split("=");
        // 使用屬性括號進行屬性賦值
        $_REQUEST[aParam[0]] = aParam[1]
      }
      return $_REQUEST;
    }
    
  //使用方法
  let dataNu = this.transform(地址)
  dataNu.code //返回的是個對象可以直接得到

拿到code就可以做很多事情了