首先參考微信開放平台的網站應用開發指南，
開發的前提是網站應用已通過微信開放平台的應用審核獲取到相應網頁授權作用域，得到網站的appid，AppSecret。具體按照微信開放平台指南操作。
獲取到appid之后，使用微信二維碼登錄有兩種方式，一種是跳轉到開放平台域名下的二維碼登錄頁面，用戶進行掃碼登錄，一種是將二維碼內嵌到應用網站，用戶進行掃碼登錄。
兩種方式登錄流程相同：
用戶視角：掃描二維碼，同意授權，網頁自動跳轉到其他頁面。
前端工作：展示二維碼，用戶授權之后，獲得code（code會跟隨在重定向地址redirect_uri后），安全起見，將code傳給后端，由后端通過code與開放平台交互獲取access_token,及用戶openid,unionid,並驗證該微信用戶是否綁定賬戶，若綁定，則進入默認頁面，未綁定，則接着進行登錄或注冊操作，將當前微信id與登錄賬號進行綁定（此時，前端需要將后端返回的unionid連同登錄注冊信息一並傳給后端，由后端進行綁定操作）；
登錄流程的實現：
按指南中操作
參數id指容納二維碼的容器，href是對二維碼相關樣式進行修改的css文件地址，官方規定此css文件必須放在https協議的網站上，本地測試及不方便，具體解決方法參考https://segmentfault.com/a/1190000011716855，使用nodejs腳本，將的寫好css資源轉換為data-url，再填入href中即可。
此時二維碼已可以生成在當前頁面，掃描授權成功后，將會轉到redirect_uri指定頁面，並在地址后跟上code和state參數，
需要根據code及appid去微信開放平台給的接口請求access_token回來，返回值包括access_token, apenid,unionid等用戶信息。由后端通過openid或者unionid來判斷當前微信用戶是否綁定，將結果反饋給前端，前端根據返回值進行下一步操作。
使用路由守衛，在重定向地址跳轉之前進行攔截，獲取到code，並傳給后端，重寫一個空頁面，進行將code傳給后端的操作，拿到返回結果再進行下一步操作，
這里是將code及unionid保存在store里面，方便各個登錄組件進行獲取，注意在使用之后及時清空這兩個參數，因為code使用一次即失效，不及時清空可能對下一次登錄造成影響