上一篇說了 Line 的第三方登入的實作,這篇記錄下Facebook 的實作
大緻相同,又有不同!
demo 位址請狠狠的戳這裡 http://download.lllomh.com/cliect/#/product/J417096994417412
一:開發者平台配置
進入開發者https://developers.facebook.com/
建立應用(我這裡已經有了)
動态操作示範:
這裡我們隻需要裡面那個appid 就可以了,也就是應用編号
facebook 的比較友善一點,不用設定回調位址,視窗登入成功就直接關掉了.傳回結果.
二:代碼
1,在index.html中加入這個 sdk, appid換成 你的應用編号:
2,在main.js中注冊該元件,同時安裝 npm install vue-facebook-signin-button
3,.然後就是在元件中使用了,可以集合到登入元件裡面去:
其中 onSignInSuccess 回調 用來擷取結果的:
完整的使用 部分:
運作結果如下:
實際使用: