从 Google+ 登录功能迁移

尽可能减少范围变更对用户的影响的步骤

  1. 如果您的应用需要经过身份验证的用户的电子邮件地址,而您之前已出于此目的使用 profile.emails.read,请改用 email
  2. 使用已获批准的验证请求为 profile.emails.read 获取批准。请参阅如何提交验证请求?
  3. 撤消对要移除的范围的先前用户令牌,或完全撤消对应用的访问权限。例如,应撤消具有 profile.emails.read 访问权限的令牌。我们建议您在用户使用您的应用时撤消授权,以便立即征得用户同意。
  4. 提示用户重新同意使用新范围(例如 email),而不使用 profile.emails.read
  5. 移除要逐步淘汰的 Google API OAuth 权限请求页面配置的范围。

您必须做出哪些更改才能将网站从 Google+ 登录迁移到 Google 登录,取决于您使用的是哪种 Google+ 登录流程。通常,迁移需要您更新登录按钮、请求的权限范围,以及有关如何从 Google 检索个人资料信息的说明。

更新登录按钮时,请勿提及 G+ 或使用红色。 遵循我们更新后的品牌推广指南

大多数 G+ 登录应用都请求了以下某种组合的权限:plus.loginplus.meplus.profile.emails.read。您需要按如下方式重新映射镜重:

旧作用域 新范围
plus.login profile
plus.me openid
plus.profile.emails.read email

许多 Google+ 登录功能的实现者都使用了代码流程。这意味着,Android、iOS 或 JavaScript 应用会从 Google 获取 OAuth 代码,然后客户端会将该代码连同跨网站请求伪造保护措施一起发送回服务器。然后,服务器会验证该代码并获取刷新令牌和访问令牌,以便从 people.get API 中提取用户个人资料信息。

Google 现在建议您请求 ID 令牌,并将该 ID 令牌从客户端发送到服务器。ID 令牌内置了跨网站伪造攻击防范措施,并且还可以在您的服务器上进行静态验证,从而避免了额外的 API 调用来从 Google 服务器获取用户个人资料信息。按照说明在服务器上验证 ID 令牌

如果您仍希望使用代码流程获取个人资料信息,可以继续这样做。服务器获得访问令牌后,您需要从我们的“登录发现文档”中指定的 userinfo 端点获取用户个人资料信息。API 响应的格式与 Google+ 个人资料响应不同,因此您需要将解析更新为新格式。

迁移 HTML 登录按钮

如果您通过将 g-signin 类分配给某个元素而在页面中添加了 Google+ 登录按钮,请进行以下更改:

  • <meta> 标记、data- 属性或参数对象中指定客户端 ID 时,请将字符串 clientid 更改为 client_id,如以下示例所示:

    <!-- Google+ Sign-in (old) -->
    <meta name="google-signin-clientid" content="YOUR_CLIENT_ID">
    

    <!-- Google Sign-in (new) -->
    <meta name="google-signin-client_id" content="YOUR_CLIENT_ID">
    
  • 将类 g-signin2 分配给登录按钮元素,而不是 g-signin。此外,还应指定单独的成功和失败回调(而非单个回调),如以下示例所示:

    <!-- Google+ Sign-in (old) -->
    <div
      class="g-signin"
      data-callback="signinCallback">
    </div>
    

    <!-- Google Sign-in (new) -->
    <div
      class="g-signin2"
      data-onsuccess="onSignIn"
      data-onfailure="onSignInFailure">
    </div>
    
  • 请定义成功和失败处理程序,而不是使用单个回调处理程序,如以下示例所示:

    // Google+ Sign-in (old)
    function signinCallback(authResult) {
      if (authResult['status']['signed_in']) {
        // Handle successful sign-in
      } else {
        // Handle sign-in errors
        console.log('Sign-in error: ' + authResult['error']);
      }
    }
    

    // Google Sign-in (new)
    function onSignIn(googleUser) {
      // Handle successful sign-in
    }
    function onSignInFailure() {
      // Handle sign-in errors
    }
    
  • 这些更改会将您的默认镜重更新为 profile email openid。您可以获取用户的基本个人资料信息,例如姓名、电子邮件地址和照片图片网址,如下所示:

    // Google Sign-in (new)
    function onSignIn(googleUser) {
      let profile = googleUser.getBasicProfile();
      let fullName = profile.getName();
      let email = profile.getEmail();
      let imageUrl = profile.getImageUrl();
    }
    

迁移动态呈现的登录按钮

如果您通过调用 gapi.signin.render() 在页面中添加了“Google+ 登录”按钮,请做出以下更改:

  • <meta> 标记、data- 属性或参数对象中指定客户端 ID 时,请将字符串 clientid 更改为 client_id,如以下示例所示:

    <!-- Google+ Sign-in (old) -->
    <meta name="google-signin-clientid" content="YOUR_CLIENT_ID">
    

    <!-- Google Sign-in (new) -->
    <meta name="google-signin-client_id" content="YOUR_CLIENT_ID">
    
  • 使用 gapi.signin2.render()(而非 gapi.signin.render())呈现登录按钮,如以下示例所示:

    // Google+ Sign-in (old)
    gapi.signin.render('myButton', additionalParams);
    

    // Google Sign-in (new)
    gapi.signin2.render('myButton', additionalParams);
    
  • 请定义成功和失败处理脚本,而不是单个回调处理脚本,如以下示例所示:

    // Google+ Sign-in (old)
    function signinCallback(authResult) {
      if (authResult['status']['signed_in']) {
        // Handle successful sign-in
      } else {
        // Handle sign-in errors
        console.log('Sign-in error: ' + authResult['error']);
      }
    }
    

    // Google Sign-in (new)
    function onSignIn(googleUser) {
      // Handle successful sign-in
    }
    function onSignInFailure() {
      // Handle sign-in errors
    }
    

这些更改会将您的默认镜重更新为 profile email openid。您可以使用 getBasicProfile() 方法获取用户的基本个人资料信息。

迁移由 JavaScript 发起的登录流程

如果您在用户点击登录按钮时通过调用 gapi.auth.signIn() 启动了登录流程,请进行以下更改:

  • <meta> 标记、data- 属性或参数对象中指定客户端 ID 时,请将字符串 clientid 更改为 client_id,如以下示例所示:

    <!-- Google+ Sign-in (old) -->
    <meta name="google-signin-clientid" content="YOUR_CLIENT_ID">
    

    <!-- Google Sign-in (new) -->
    <meta name="google-signin-client_id" content="YOUR_CLIENT_ID">
    
  • 使用 gapi.auth2.attachClickHandler() 可在用户按某个按钮时启动登录流程,如以下示例所示:

    // Google+ Sign-in (old)
    var signinButton = document.getElementById('signinButton');
    signinButton.addEventListener('click', function() {
      gapi.auth.signIn(additionalParams);
    });
    

    // Google Sign-in (new)
    auth2 = gapi.auth2.init();
    auth2.attachClickHandler('signinButton', additionalParams, onSignIn, onSignInFailure);
    
  • 请定义成功和失败处理脚本,而不是单个回调处理脚本,如以下示例所示:

    // Google+ Sign-in (old)
    function signinCallback(authResult) {
      if (authResult['status']['signed_in']) {
        // Handle successful sign-in
      } else {
        // Handle sign-in errors
        console.log('Sign-in error: ' + authResult['error']);
      }
    }
    

    // Google Sign-in (new)
    function onSignIn(googleUser) {
      // Handle successful sign-in
    }
    function onSignInFailure() {
      // Handle sign-in errors
    }
    

这些更改会将您的默认镜重更新为 profile email openid。您可以通过调用 getBasicProfile() 方法来获取用户的基本个人资料信息。

迁移混合服务器端流

如果您使用 JavaScript API 获取了要传递给服务器的一次性授权代码,请进行以下更改:

  • 将范围从 https://www.googleapis.com/auth/plus.login 更改为 profile

  • gapi.auth2.grantOfflineAccess() 方法与现有回调函数搭配使用,如以下示例所示:

    <!-- Google+ Sign-in (old) -->
    <div class="g-signin"
      data-scope="https://www.googleapis.com/auth/plus.login"
      data-clientid="YOUR_CLIENT_ID"
      data-redirecturi="postmessage"
      data-accesstype="offline"
      data-callback="signInCallback">
    </div>
    

    // Google Sign-in (new)
    auth2 = gapi.auth2.init({
      client_id: 'YOUR_CLIENT_ID',
      scope: 'profile'
    });
    
    ...
    
    auth2.grantOfflineAccess().then(signInCallback);
    

如果您还需要访问用户的电子邮件,请将 email 添加到 scope 参数。