ionic5 + angular10 + cordova 第三方登录 （facebook）

APP第三方登录

最近复习angular，整理了一下之前的笔记，做的第三方登录，当时也是研究好久，记录下

1. facebook登录

前期准备 ：

1.1需要翻墙，在facebook官网注册一个账号https://www.facebook.com/

1.2使用注册的facebook账号登录facebook developer 成为开发者 https://developers.facebook.com/

1.3 点击myapps 创建一个app

 因为是做登录，所以选的是consumer

接下来的操作根据自己的需求，填写文档，最后获取到自己需要的facebook id

开发：

需要用到的插件  ionic-native/facebook

$ ionic cordova plugin add cordova-plugin-facebook-connect --variable APP_ID="123456789" --variable APP_NAME="myApplication"
$ npm install @ionic-native/facebook

想要查看别的版本可以去npm插件市场看 链接在这npm

安装的时候 APP_ID和APP_NAME这两个参数，需要用到上面授权的时候生成的的facebook id 和 应用的名称 否则使用facebook登录的时候授权会失败

 --variable APP_ID="123456789" --variable APP_NAME="myApplication"

PS：这里需要注意下两个问题：

1. 最新版本的facebook插件，和cordova版本有些不兼容，导致打不了apk包，cordova版本太低要升级版本。

2. cordova版本过高，会导致有些版本比较落后的安卓机，打开app的时候回白屏，iOS打开会黑屏，cordova版本需要向下兼容低版本手机

解决cordova版本兼容问题：

1. 安装 globalthis 插件 

2. 在 polyfills.ts 文件中引入

import 'globalthis/auto';

 代码部分：

引入插件

import {Facebook, FacebookLoginResponse} from '@ionic-native/facebook/ngx';

// 校验登录并获取token
 getAccessToken() {
    return new Promise((resolve, reject) => {
       this.facebook.getLoginStatus().then((res: any) => { // 获取登录状态
          if (['connected', 'not_authorized'].includes(res.status)) { // 退出登录
             this.facebook.logout().then((res: any) => {
                  this.login().then((res: any) => {
                      resolve(res)
                   })
              })
           } else {
              this.login().then((res: any) => {
                 resolve(res)
              })
           }

         }).catch(e => {
             reject(e)
         })
     })
  }

  // 登录
    login() {
        return new Promise((resolve, reject) => {
            this.facebook.login(['public_profile', 'email'])
                .then((res: FacebookLoginResponse) => {
                    resolve(res.authResponse)
                })
                .catch(e => {
                    if (e.errorCode == 4201) return
                    this.bt.fadeInTips(JSON.stringify(e))  //封装的toast组件，将报错信息弹窗出来
                });
        })
    }

通过login 返回的数据，再进行操作，一般会用到的都是 accessToken 和userId

到这里就完成facebook第三方登录了。