使用微信開發者工具調試微信網頁授權登錄-react

轉：https://www.jianshu.com/p/9ced1a297c95

1.使用localhost本地調試

1. 使用微信開發者工具, 選擇微信網頁授權, 微信團隊爲廣大的開發者提供了一個測試賬號。該帳號無需公衆賬號，快速申請接口測試，直接體驗和測試公衆平臺所有高級接口。這麼好用的功能，只需要要你有一個手機，手機上安裝了一個微信即可。
   地址：
   https://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login
   登錄後，會得到一個微信號，和測試好的相關信息。appID,appsecret。
2. 掃描測試號二維碼, 並關注公衆號.在網頁服務的網頁賬號中點擊修改,填入127.0.0.1:8080(沒有http)
3. 組裝授權Url.
   https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
   把參數替換成自己的參數, appid填入測試號的appid, REDIRECT_URI填入 經過encodeURIComponent()的參數,SCOPE填入snsapi_userinfo, state=#wechat_redirect即可 eg:https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxef450dbeb79f6c72&redirect_uri=http://5ed286c2.ngrok.io/wx/mp&response_type=code&scope=snsapi_userinfo&state=#wechat_redirect
4. 把組裝後的url填入微信開發者工具地址欄中就可以發起授權彈窗了

2.使用ngrok映射本機ip使外網可以訪問.

1. 申請ngrok賬號(https://ngrok.com), 經過官網四步後,生成一個可在外網訪問的域名
2. 在測試賬號的域名中添加自己生成的域名(不要加http和端口)
3. 組裝url 訪問調試

作者：sologuy
鏈接：https://www.jianshu.com/p/9ced1a297c95
來源：簡書
簡書著作權歸作者所有，任何形式的轉載都請聯繫作者獲得授權並註明出處。