Apple Login接入前一次深入研究

隐私

只追踪用户昵称和邮箱
安全性
- 双重认证
- Touch ID
- Face ID
支持平台
- MacOS
- iOS
- tvOS
- watchOS
- Web
防欺诈

保证用户的真实性

人机交互

交互建议

尽可能去掉苹果登录之后的表单填写密码设置等操作

尽可能所有的 Apple 平台和 Web 统一包含苹果登录

使用场景

开始使用苹果登录
继续使用苹果登录

颜色
白色无边框
白色有边框
黑色无边框

按钮大小

Apple Login按钮和其他登录按钮大小保持一致
Apple Login 按钮应该放在第一屏
Apple Login 最小宽度 (140px @1x / 280px @2x)
Apple Login 最小高度 (30px @1x/ 60px @2x)
Apple Login 最小的内间距 (高度的 1/10)

按钮的圆角样式

审核指南

专门使用第三方或社交登录服务的应用程序（如Facebook登录，Google登录，使用Twitter登录，使用LinkedIn登录，使用亚马逊登录或微信登录）必须添加苹果登录。

如果符合以下条件，则无需使用Apple登录：

您的应用专门使用您公司自己的帐户设置和登录系统。
您的应用是教育，企业或商业应用，需要用户使用现有的教育或企业帐户登录。
您的应用使用政府或行业支持的公民身份识别系统或电子ID来验证用户身份。
您的应用是特定第三方服务的客户，用户需要直接登录其邮件，社交媒体或其他第三方帐户才能访问其内容。

接入指南

原生 Apple 平台，适应于`iOS`,`macOS`,`tvOS`,`watchOS`。

导入下面的框架

import AuthenticationServices

使用身份验证服务框架可以在用户输入凭据以建立其身份时改善用户体验。

使用户能够使用Apple ID登录您的服务。

使用户能够从应用程序的登录流程中查找其存储的密码。

使用OAuth等技术在应用和Web浏览器之间共享数据，以利用应用中现有的基于Web的登录。

在企业应用程序中创建单点登录（SSO）体验。

简单直接的注册和登录流程减轻了用户记住密码的负担。这鼓励使用强密码，从而提高安全性。

官方 Demo

https://docs-assets.developer.apple.com/published/8f9ca51349/AddingTheSignInWithAppleFlowToYourApp.zip

官方 Demo 的逻辑代码流程

Apple Login签名

键值	类型
com.apple.developer.applesignin	数组

默认值 Default

在 Xcode 启用 Apple Login 功能（Xcode11）

创建授权请求

let provider = ASAuthorizationAppleIdProvider()
let request = provider.createRequest()
let controller = ASAuthorizationController(authorizationRequests: [request])

查询授权是否过期

let user = authorization.credential.user
provider.getCredentialState(forUserID: user) { state, error in
    // Check for error and examine the state.
}

其他的流程代码参考上图 Demo 的代码逻辑图

使用Apple登录是安全地加载新用户的最快方式。使用Apple登录还提供双因素身份验证。使用Apple JS登录，您可以允许用户使用Apple ID登录您的网站，而无需创建新的帐户和密码。

为您的应用启用Apple登录首先在Apple Developer帐户中注册您的应用程序。选择要求的用户信息，按钮演示样式，服务器集成和通知选项是将API与您的应用集成时需要考虑的重要步骤。

要在服务器和Apple服务器之间进行通信，请使用Apple REST API登录。或者，要让用户设置帐户并登录到您的原生iOS，macOS，tvOS和watchOS应用程序，请使用AuthenticationServices框架。

配置您的网页以使用Apple登录

嵌入 Apple Login JS

<script type="text/javascript" src="https://appleid.cdn-apple.com/appleauth/static/jsapi/appleid/1/en_US/appleid.auth.js"></script>

配置授权对象

纯 HTML

<html>
    <head>
        <meta name="appleid-signin-client-id" content="[CLIENT_ID]">
        <meta name="appleid-signin-scope" content="[SCOPES]">
        <meta name="appleid-signin-redirect-uri" content="[REDIRECT_URI]">
        <meta name="appleid-signin-state" content="[STATE]">
    </head>
    <body>
        <div id="appleid-signin" data-color="black" data-border="true" data-type="sign in"></div>
        <script type="text/javascript" src="https://appleid.cdn-apple.com/appleauth/static/jsapi/appleid/1/en_US/appleid.auth.js"></script>
    </body>
</html>

JS

<html>
    <head>
    </head>
    <body>
        <script type="text/javascript" src="https://appleid.cdn-apple.com/appleauth/static/jsapi/appleid/1/en_US/appleid.auth.js"></script>
        <div id="appleid-signin" data-color="black" data-border="true" data-type="sign in"></div>
        <script type="text/javascript">
            AppleID.auth.init({
                clientId : '[CLIENT_ID]',
                scope : '[SCOPES]',
                redirectURI: '[REDIRECT_URI]',
                state : '[STATE]'
            });
        </script>
    </body>
</html>

处理授权响应

报文类型:application/x-www-form-urlencoded

正确响应

字段	说明
code	一次性验证代码有效期五分钟
id_token	用户的 JSON Token 令牌
state	初始化函数配置的
user	包含`scope`属性中请求的数据的JSON字符串。返回的数据采用以下格式：`{ "name": { "firstName": string, "lastName": string }, "email": string }`

错误响应

字段	说明
state	初始化函数配置的
error	返回的错误代码

目前，唯一返回的错误代码是。当用户在Web流期间单击取消按钮时，将返回此错误代码。user_cancelled_authorize

使用Apple按钮显示和配置登录

创建一个包装器标签并设置id为“ appleid-signin”; 例如，<div id="appleid-signin"></div>。

以下是如何使用Apple按钮创建和显示黑色登录的示例

<html>
    <head>
        <meta name="appleid-signin-client-id" content="[CLIENT_ID]">
        <meta name="appleid-signin-scope" content="[SCOPES]">
        <meta name="appleid-signin-redirect-uri" content="[REDIRECT_URI]">
        <meta name="appleid-signin-state" content="[STATE]">
    </head>
    <style>
        .signin-button {
            width: 210px;
            height: 40px;
        }
    </style>
    <body>
        <div id="appleid-signin" class="signin-button" data-color="black" data-border="true" data-type="sign in"></div>
        <script type="text/javascript" src="https://appleid.cdn-apple.com/appleauth/static/jsapi/appleid/1/en_US/appleid.auth.js"></script>
    </body>
</html>

其他属性

data-type（按钮的类型）

sign in(默认)
continue

data-color（按钮样式）

black（默认）
white

data-border（按钮边框）

false（默认）
true

适用于不能接入苹果登录 JS 的其他平台

添加自定义`使用Apple登录`按钮

从https://appleid.cdn-apple.com/appleid/button下载使用Apple登录按钮图像。将下载URL放入浏览器会触发下载可嵌入应用程序的PNG文件。通过向URL添加查询参数来自定义按钮图像。如果将无效查询参数发送到端点URL，则服务器将返回404 Page Not Found错误

参数	解释
height	按钮图像的高度。最小值和最大值分别为30和64，默认值为30。
width	按钮图像的宽度。最小值和最大值分别为130和375，默认值为140。
color	按钮图像的背景颜色。可能的值是`white`和`black`（默认值）
border	一个布尔值，用于确定按钮图像是否具有边框。默认值为`false`
type	返回的按钮图像的类型。可能的值是`sign-in`（默认值）和`continue`
border_radius	按钮图像的圆角半径。最小值和最大值分别为0和50，默认值为15
scale	按钮图像的比例。最小值和最大值分别为1和6，默认值为1
locale	用于按钮上文本的语言。可能的值是`sk_SK` `ar_SA` `ca_ES` `cs_CZ` `da_DK` `de_DE` `el_GR` `en_GB` `en_US` `es_ES` `es_MX` `fi_FI` `fr_CA` `fr_FR` `hr_HR` `hu_HU` `id_ID` `it_IT` `iw_IL` `ja_JP` `ko_KR` `ms_MY` `nl_NL` `no_NO` `pl_PL` `pt_BR` `pt_PT` `ro_RO` `ru_RU` `sv_SE` `th_TH` `tr_TR` `uk_UA` `vi_VI` `zh_CN` `zh_HK zh_TW`

发送所需的查询参数

将授权请求指向以下URL：https：//appleid.apple.com/auth/authorize

参数	解释
client_id	（必需）开发人员的客户端标识符，由WWDR提供
redirect_uri	（必需）授权重定向到的URI
response_type	（必填）请求的响应类型。有效值为`code`和。您可以申请其中一个或两个。请求响应类型时，必须是或。`id_token` `id_token` `response_mode` `fragment` `form_post`
scope	Apple要求的用户信息量。有效值为`name`和`email`。您可以请求一个，两个或全部
response_mode	预期的响应模式类型。有效值是`query`，`fragment`和。如果您请求任何范围，则值必须为。`form_post` `form_post`
state	请求的当前状态。
nonce	用于将客户端会话与ID令牌关联的String值。此值还用于缓解重放攻击

处理响应

响应请参考上文 JS 中对应返回值

将控制权返回给应用程序

支持自定义URL方案（iOS 12.0及更早版本和Android）的平台必须通过将其存储在其端点逻辑中的应用服务器上来处理授权流程产生的数据。然后，您必须重定向自定义URL方案(redirect_uri)以将控制权交还给应用程序。