首頁 >web前端 >js教程 >ajax 實作微信網頁授權登入的方法(圖文教學)

ajax 實作微信網頁授權登入的方法(圖文教學)

亚连
亚连原創
2018-05-21 16:03:532252瀏覽

這篇文章主要介紹了ajax 實作微信網頁授權登入的方法,現在分享給大家,也給大家做個參考。

專案背景

因為專案採用前後端完全分離方案,所以,無法使用常規的微信授權登入作法,需要採用 ajax 實現微信授權登入。

需求分析

因為本身就是一個phper ,所以,微信開發採用的是 EasyWeChat ,所以實作的方式是基於EW的。

其實實現這個也很麻煩,在實現之前,我們需要先了解微信授權的整個流程。

  1. 引導使用者進入授權頁面同意授權,取得code

  2. 透過code換取網頁授權access_token(與基礎支援中的access_token不同)

  3. 如果需要,開發者可以刷新網頁授權access_token,避免過期

  4. 透過網頁授權access_token和openid獲取使用者基本資訊(支援UnionID機制)

其實說白了,前端只需要乾一件事兒,引導用戶發起微信授權頁面,然後得到code,然後跳到當前頁面,然後再請求後端換取使用者以及其他相關資訊。

功能實作

引導使用者喚起微信授權確認頁面

這裡需要我們做兩件事,第一去設定jsapi域名,第二設定微信網頁授權的回呼網域名稱

建構微信授權的url "https://open.weixin.qq.com/connect/oauth2/authorize?appid=" appId "&redirect_uri=" location. href.split('#')[0] "&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect 我們從連接中看到有兩個變量,appId,以及redirect_uri。appId 不用多說,就是咱們將要授權的微信公眾號的appId,另一方個回呼URL,其實就是我們目前頁面的URL。是code,另一個就是state。 #後端得到code 以後,取得使用者基本信息,並返回相關其他資訊給前端,前端獲取到然後做本地存儲或其他。 ,希望今後會對大家有幫助。

  1. ##ajax

    php控制函數呼叫步驟詳解

  2. #Ajax實作Loading效果

以上是ajax 實作微信網頁授權登入的方法(圖文教學)的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn