Google One Tap 一键式注册 登陆

https://developers.google.com/identity/one-tap/web/guides/get-google-api-clientid

Get your Google API client ID // 获取api id

1. Open the “Credentials” page of the Google APIs console
2. 如果有 web client id 直接用， 没有就注册 click Create credentials > OAuth client ID to create one.

Configure your OAuth Consent Screen // 同意屏设置

同意屏窗口 告诉用户哪些data 会用到

1. On the “OAuth consent screen” page, fill out the form and click the “Save” button. //填好保存
2. Check “Verification Status”, if your application needs verification then click the “Submit For Verification” button to submit your application for verification // 然后验证

 If your app requests scopes categorized as sensitive or restricted, you will probably need to complete the verification process (see, however, the exceptions) // 如果app 获取敏感或者限制的数据 需要在验证时补写信息

https://support.google.com/cloud/answer/9110914

A few examples of sensitive scopes are some of the scopes used by the Calendar API, People API, and YouTube Data API, but there are others. Restricted scopes are fewer in number, currently including only scopes used by the Gmail API and Drive API.

验证提交时 要填写每一个Scopes justification 比如 My app will use https://www.googleapis.com/auth/calendar to show a user’s Google calendar data on the scheduling screen of my app, so that users can manage their schedules through my app and sync the changes with their Google calendar.

Load the One Tap client library

页面加载一键式陆库

需要登陆页面加载 <script src=”https://accounts.google.com/gsi/client”></script> //You can optimize your page’s loading speed by loading the script with the async and defer boolean attributes.

Display Google One Tap

将以下代码段放入要显示Google One Tap的任何页面中：

<div id="g_id_onload"
     data-client_id="YOUR_GOOGLE_CLIENT_ID"
     data-login_uri="https://your.domain/your_login_endpoint"
     data-your_own_param_1_to_login="any_value"
     data-your_own_param_2_to_login="any_value">
</div>

The data-login_uri attribute is the URI of the login endpoint of your own web app. You can add custom data attributes, which are sent to your login endpoint with the ID token retrieved from Google.

Automatic sign in and sign out

描述如何实现与用户使用“一键登录”登录或注销有关的功能

Sign in users automatically

<div id="g_id_onload"
     data-client_id="YOUR_GOOGLE_CLIENT_ID"
     data-auto_select="true"
     data-login_uri="https://your.domain/your_login_endpoint">
</div>

Sign up

用户退出您的网站时，可以将他们定向到自动显示“一键式”提示的页面。在这种情况下，必须禁止自动选择。 否则会死循环登陆

Verify the Google ID token on your server side (验证服务器端的Google ID令牌)

从Google返回ID令牌后，它会通过HTTP POST方法请求以参数名称凭据的形式提交给您的登录端点(后端)

1. 当您向登录端点提交凭据时，我们使用double-submit-cookie模式来防止CSRF攻击。Before each submission, we generate a token and then the token is put into both the cookie and the post body. See the following code example

csrf_token_cookie = self.request.cookies.get('g_csrf_token')
if not csrf_token_cookie:
    webapp2.abort(400, 'No CSRF token in Cookie.')
csrf_token_body = self.request.get('g_csrf_token')
if not csrf_token_body:
    webapp2.abort(400, 'No CSRF token in post body.')
if csrf_token_cookie != csrf_token_body:
    webapp2.abort(400, 'Failed to verify double submit cookie.')

通过HTTPS POST收到ID令牌后，必须验证令牌的完整性。要验证令牌是否有效，请确保满足以下条件：

• 该ID令牌已由Google正确签名。使用Google的公共密钥（以JWK或PEM格式提供）来验证令牌的签名, 这些键会定期旋转。检查响应中的Cache-Control标头，以确定何时应再次检索它们。

强烈建议您使用适用于您平台的Google API客户端库或通用JWT库，而不是编写自己的代码来执行这些验证步骤

require_once 'vendor/autoload.php';

// Get $id_token via HTTPS POST.

$client = new Google_Client(['client_id' => $CLIENT_ID]);  // Specify the CLIENT_ID of the app that accesses the backend
$payload = $client->verifyIdToken($id_token);
if ($payload) {
  $userid = $payload['sub'];
  // If request specified a G Suite domain:
  //$domain = $payload['hd'];
} else {
  // Invalid ID token
}