官方文檔:網站應用微信登陸開發指南css
http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js
在須要使用微信登陸的地方實例如下JS對象:html
var obj = new WxLogin({ id:"containerId", // 須要顯示的容器id self_redirect:true,/*true:手機點擊確認登陸後能夠在 iframe 內跳轉到 redirect_uri,false:手機點擊確認登陸後能夠在 top window 跳轉到 redirect_uri。默認爲 false。*/ appid: "wx*****", // 公衆號appid wx******* scope: "snsapi_login", // 應用受權做用域,以逗號隔開。網頁應用目前僅支持snsapi_login redirect_uri: "", // 受權成功後回調的url state: "", /* 用於保持請求和回調的狀態,受權請求後原樣帶回給第三方。該參數可用於防止csrf攻擊(跨站請求僞造攻擊),可設置爲簡單的隨機數加session用來校驗*/ style: "black", // 提供"black"、"white"可選。二維碼的樣式 href: "" // 外部css文件url,須要https });
在node層,添加一個redirect_uri對應的路由,當路由接受到對應請求,先校驗一下state,而後將拿到的code和appid, secret, grant_type參數請求 https://api.weixin.qq.com/sns...,拿到用戶的ACCESS_TOKENnode
經過ACCESS_TOKEN訪問https://api.weixin.qq.com/sns...,即可以拿到用戶的微信信息了。api
將拿到的用戶信息(有用戶的惟一的openid),調用後臺的微信登陸接口,成功redirect到進入登陸頁面以前的url即可以了。微信
備註:有的狀況可能須要校驗或刷新用戶的ACCESS_TOKEN.session