阿尔卑斯丶
圣骑士
圣骑士
  • 最后登录2023-11-03
  • 发帖数59
  • 社区居民
  • 原创写手
阅读:1985回复:0

[vue]第三方登录之apple登录

楼主#
更多 发布于:2023-07-17 22:35
引入一个第三方指令
vue-apple-login-directive
响应式声明这些内容
appleSettings:{
    clientId: "com.xxxxx.xxxxx",
    scope: "name email",
    redirectURI: "https://www.xxxx.com",
    state: "initial",
    usePopup:true,
    OnSuccess:this.OnSuccess,
    Onfail:this.Onfail
},
解释一下,client id就是客户端id,在apple的配置中好像是叫bundle id;
redirectURI 是重定向地址  需要和apple配置中的一样,文档中没有说明,但是如果usePopup是true的话,代表你用的是弹窗模式,其实它不会在认证完之后跳转到重定向地址,只有没设置usePopup或者设置为false时会跳转。
OnSuccess和Onfail是成功和失败时候的回调。
代码如下
OnSuccess(data) {
    this.handleAuthorizationAppleIDResponse(data);
},
Onfail(error) {
    console.log('error', error);
},
handleAuthorizationAppleIDResponse 就是获取信息的方法,简要代码如下
handleAuthorizationAppleIDResponse(response) {
            if (response.authorization && response.authorization.code) {
                // 使用授权码向服务器请求获取ID token
                console.log('response',response)
                  try {  
    fetch('后端接口', {  
      method: 'POST',  
      headers: {  
        'Content-Type': 'application/json',  
      },  
      body: JSON.stringify({  
        idToken:response.authorization.id_token
      }),  
    });  
  } catch (error) {  
    throw new Error(``);  
  }  
                })
            }
        },
简要代码如上
游客


返回顶部

公众号

公众号