苹果登录
网页端的苹果登录
调用后端的苹果登录接口,后端实现就是使用oauth_client来获取用户的授权,然后返回一个重定向地址,这个地址就是Apple 的登录页面,在这里用户完成授权登录
在用户完成 Apple 登录后,Apple 会将用户重定向回您的应用,并带上 code、state 等参数
然后这里就触发这个回调,也就是下面的回调接口:
苹果的回调接口逻辑是拿着用户的授权码去请求用户数据,然后苹果会返回一个包含用户信息的加密令牌,然后我们使用秘钥解码 Apple 返回的 JWT
最后总结一下网页端的登录,调用登录接口去获得用户授权,然后拿着授权码去申请用户信息,成功后自动重定向跳转
APP端的苹果登录
Android 端的苹果登录本质上是通过 WebView 或 Chrome Custom Tabs 加载网页版的登录界面,所以使用 Web 配置,所以和web端一致
苹果端iOS 应用必须使用 Bundle ID 作为 client_id,所以单独一套配置,来看前端:
前端使用的是expo集成的库,然后调用登录方法,返回授权码,所以app端的这一步相当于网页端的第一步。
然后这里设置了路由参数,触发苹果的回调,回调成功后,拿到token进行登录
谷歌登录
网页版谷歌登录
和苹果网页版登录类似,换个名称:
APP端的谷歌登录
app端的谷歌登录也是支持谷歌原生登录的,为什么最好的体验,没有使用expo的库,使用rn的库,这个支持谷歌的原生登录,效果更好
首先看一下在谷歌控制台怎么设置的:
就是三个,需要全部在代码中配置,详细见代码中
然后拿到这个idtoken,还要修改后端来适配app端的登录,加参数app的state参数到后端来识别,网页端和app端不同的处理,网页端还多一步:
安卓的谷歌登录
需要设置设备指纹:
配置然后要申请对应的权限:
然后和安卓的苹果登录类似,测试通过