昨天刚总结了网站使用Apple的WeatherKit的REST API接口,流程差不多,所以赶紧趁热打铁总结这篇《网站使用苹果登录Sign In with Apple》。
使用原生接口继承苹果登录很简单,本篇写一下网站跳转接入的方式实现APP和网站登录同一个用户。
一、创建APPID
1、创建app ID
网站是二等公民,是为app服务的,所以即便你仅仅只是需要网站登录,也依旧需要先创建APP类型的Bundle ID。
在开发者后台,选择Identifiers
,创建一个App ID,类型是APP,在Capabilities勾选Sign In with Apple
,然后选择Edit
。在弹窗中根据需要选择标记为新的主app ID还是用其他的主app ID
主APP ID是标记分组的作用,同一个主APPID,用户只需同意就可以为每组应用程序和网站与您共享一次他们的信息。所以软件A、B、C可以用同一个主APPID来共享用户。
弹窗里填的通知地址是接收有关用户及其帐户的重要更新的回调地址,比如用户删除appleID、更改了邮箱等回调通知。配置了https接口即可
2、创建Services IDs
Services IDs就是给网站使用了,在开发者后台,选择Identifiers
,创建一个Services ID,填写描述和Identifier之后,选择continue
,然后注册。
注册之后,在开发者后台,选择Identifiers
,右侧筛选Services ID,然后点击去编辑。勾选Sign In with Apple
,之后点击Configure
配置。
- Primary APP ID选择上面创建的APP的主id,用于绑定用户,用户在同一个主id的网站和app中可以共享用户信息。
- Domains and Subdomains 是调用的网站域名和子域名,例如dongge.org,是调用的白名单,不包含路径
- Return URLs就是用户网站授权之后,返回带授权码信息的url路径。
二、创建秘钥
同样在开发者后台,选择Keys
,创建一个key文件,勾选Sign In with Apple
功能,点击Configure,选择上面创建的主APPID,保存之后,会有一个Download
选项,将这个文件下载下来。是一个 .p8 结尾的文件,重命名为key.txt
为了后面加密更方便。
该文件只能下载一次,丢失或者删除的话,需要重新创建。同时也记录创建的Key ID,在列表页也可以看到Key ID。
三、签名
使用mac自带的终端命令行签名更方便。
1、在终端执行命令(需要有Ruby环境)
gem install jwt
Mac自带的有Ruby,如果你执行该命令报错不存在,可能是没安装Ruby或者版本过老,可以通过Homebrew安装Ruby之后再执行上面命令。
2、创建执行的ruby文件
新建纯文本文件,名字为client_secret.rb
,放在上面key.txt文件同级目录。
内容
require 'jwt'
key_file = 'key.txt'
team_id = ''
client_id = ''
key_id = ''
ecdsa_key = OpenSSL::PKey::EC.new IO.read key_file
headers = {
'kid' => key_id
}
claims = {
'iss' => team_id,
'iat' => Time.now.to_i,
'exp' => Time.now.to_i + 86400*180
'aud' => 'https://appleid.apple.com',
'sub' => client_id,
}
token = JWT.encode claims, ecdsa_key, 'ES256', headers
puts token
- team_id是开发账号的teamID
- client_id是前面创建的Service ID,不是绑定的主APPID
- key_id是前面创建秘钥时的key ID
- 文件里面的exp过期时间最长六个月,过期调用的话需要重新更新,否则会报错401
3、生成Token
在client_secret.rb文件夹下,执行下面命令,就会生成一个tokens。这个token是服务器验证时会使用。
ruby client_secret.rb
四、网站跳转
网站跳转可以自己拼接跳转路径,放个按钮直接跳转拼写的appleLoginUrl
链接即可。
generalAppleLogin() {
let time = new Date()
let state = encodeURIComponent('ss' + time.getTime())
//clientId修改为正确的Service ID
let clientId = encodeURIComponent("com.web.serviceid")
//回调地址修改为创建Service ID时填写的Return URLs
let redirectUri = config.host + "login/appleCallback"
//拼接跳转地址
this.appleLoginUrl = `https://appleid.apple.com/auth/authorize?response_type=code&response_mode=form_post&client_id=${clientId}&redirect_uri=${redirectUri}&state=${state}&scope=name email`
},
回调token验证
在用户通过网页跳转,输入信息之后,会将用户code传到回调地址。
拿到用户code之后,请求https://appleid.apple.com/auth/token
验证,
- 参数client_id是创建的Services ID
- client_secret是前面通过脚本创建的token
- code是回调的用户code,只能使用一次,并且五分钟有效期
- grant_type写死
authorization_code
验证成功之后,苹果会返回用户的信息,信息中的 sub 值是用户的唯一标识符。现在可以将此值存储在自己的数据库中,并使用它来确定同一用户是否再次登录
参考文章
- 网站使用Apple的WeatherKit的REST API接口
- https://developer.okta.com/blog/2019/06/04/what-the-heck-is-sign-in-with-apple
版权属于:东哥笔记 - DongGe.org
本文链接:https://dongge.org/blog/1355.html
自2017年12月26日起,『转载以及大段采集进行后续编辑』须注明本文标题和链接!否则禁止所有转载和采集行为!