這篇文章主要介紹ajax如何實(shí)現(xiàn)微信網(wǎng)頁(yè)授權(quán)登錄，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！

承留網(wǎng)站制作公司哪家好，找成都創(chuàng)新互聯(lián)！從網(wǎng)頁(yè)設(shè)計(jì)、網(wǎng)站建設(shè)、微信開發(fā)、APP開發(fā)、成都響應(yīng)式網(wǎng)站建設(shè)等網(wǎng)站項(xiàng)目制作，到程序開發(fā)，運(yùn)營(yíng)維護(hù)。成都創(chuàng)新互聯(lián)2013年開創(chuàng)至今到現(xiàn)在10年的時(shí)間，我們擁有了豐富的建站經(jīng)驗(yàn)和運(yùn)維經(jīng)驗(yàn)，來(lái)保證我們的工作的順利進(jìn)行。專注于網(wǎng)站建設(shè)就選成都創(chuàng)新互聯(lián)。

項(xiàng)目背景

因?yàn)轫?xiàng)目采用前后端完全分離方案，所以，無(wú)法使用常規(guī)的微信授權(quán)登錄作法，需要采用 ajax 實(shí)現(xiàn)微信授權(quán)登錄。

需求分析

因?yàn)楸救耸且粋€(gè)phper ，所以，微信開發(fā)采用的是 EasyWeChat ，所以實(shí)現(xiàn)的方式是基于EW的。

其實(shí)實(shí)現(xiàn)這個(gè)也麻煩，在實(shí)現(xiàn)之前，我們需要了解一下微信授權(quán)的整個(gè)流程。

1. 引導(dǎo)用戶進(jìn)入授權(quán)頁(yè)面同意授權(quán)，獲取code

2. 通過(guò)code換取網(wǎng)頁(yè)授權(quán)access_token（與基礎(chǔ)支持中的access_token不同）

3. 如果需要，開發(fā)者可以刷新網(wǎng)頁(yè)授權(quán)access_token，避免過(guò)期

4. 通過(guò)網(wǎng)頁(yè)授權(quán)access_token和openid獲取用戶基本信息（支持UnionID機(jī)制）

其實(shí)說(shuō)白了，前端只需要干一件事兒，引導(dǎo)用戶發(fā)起微信授權(quán)頁(yè)面,然后得到code,然后跳轉(zhuǎn)到當(dāng)前頁(yè)面,然后再請(qǐng)求后端換取用戶以及其他相關(guān)信息。

功能實(shí)現(xiàn)

引導(dǎo)用戶喚起微信授權(quán)確認(rèn)頁(yè)面

這里需要我們做兩件事，第一去配置jsapi域名，第二配置微信網(wǎng)頁(yè)授權(quán)的回調(diào)域名

構(gòu)建微信授權(quán)的url "https://open.weixin.qq.com/connect/oauth3/authorize?appid=" + appId + "&redirect_uri=" + location.href.split('#')[0] + "&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect 我們從連接中看到有兩個(gè)變量，appId,以及 redirect_uri。appId 不用多說(shuō)，就是咱們將要授權(quán)的微信公眾號(hào)的appId,另一方個(gè)回調(diào)URL，其實(shí)就是我們當(dāng)前頁(yè)面的URL。

1. 用戶微信登錄授權(quán)以后回調(diào)過(guò)來(lái)的URL 會(huì)攜帶兩個(gè)參數(shù) ，第一個(gè)是code,另一個(gè)就是 state。才是我們需要做的一件事兒就是將code獲取到然后傳給后端，染后端通過(guò)code 獲取用戶基本信息。

2. 后端得到code 以后，獲取用戶基本信息，并返回相關(guān)其他信息給前端，前端獲取到然后做本地存儲(chǔ)或者其他。

function getUrlParam(name) {
  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
  var r = window.location.search.substr(1).match(reg);
  if (r != null) return unescape(r[2]);
  return null;
}
function wxLogin(callback) {
  var appId = 'xxxxxxxxxxxxxxxxxxx';
  var oauth_url = 'xxxxxxxxxxxxxxxxxxx/oauth';
  var url = "https://open.weixin.qq.com/connect/oauth3/authorize?appid=" + appId + "&redirect_uri=" + location.href.split('#')[0] + "&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect"
  var code = getUrlParam("code");
  if (!code) {
    window.location = url;
  } else {
    $.ajax({
      type: 'GET',
      url: oauth_url,
      dataType: 'json',
      data: {
        code: code
      },
      success: function (data) {
        if (data.code === 200) {
          callback(data.data)
        }
      },
      error: function (error) {
        throw new Error(error)
      }
    })
  }

以上是“ajax如何實(shí)現(xiàn)微信網(wǎng)頁(yè)授權(quán)登錄”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對(duì)大家有幫助，更多相關(guān)知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

網(wǎng)頁(yè)標(biāo)題：ajax如何實(shí)現(xiàn)微信網(wǎng)頁(yè)授權(quán)登錄
標(biāo)題來(lái)源：http://chinadenli.net/article16/gidggg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供App開發(fā)、網(wǎng)站排名、建站公司、商城網(wǎng)站、營(yíng)銷型網(wǎng)站建設(shè)、Google

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)