让用户通过 GitHub 登录

本文档介绍如何使用 Identity Platform 让用户通过 GitHub 登录。

准备工作

本教程假定您已启用 Identity Platform,并且拥有一个使用 HTML 和 JavaScript 编写的基本 Web 应用。如需了解具体方法,请参阅快速入门

将 GitHub 配置为提供商

如需将 GitHub 配置为身份提供商,请执行以下操作:

  1. 转到 Cloud Console 中的 身份提供商页面。

    转到“身份提供商”页面

  2. 点击添加提供商

  3. 从列表中选择 GitHub

  4. 输入您的 GitHub 客户端 ID客户端密钥。如果您还没有 ID 和密钥,则可以从 GitHub 应用页面获取一个。

  5. 配置 GitHub 下列出的 URI 配置为您的 GitHub 应用的有效 OAuth 重定向 URI。

  6. 点击已获授权的网域下的添加网域,以注册您应用的网域。出于开发目的,localhost 默认处于启用状态。

  7. 配置您的应用下,点击设置详情。将代码段复制到应用的代码中,以初始化 Identity Platform Client SDK。

  8. 点击保存

让用户通过 Client SDK 登录

  1. 创建 GitHub 提供商对象实例:

    JavaScript

    var provider = new firebase.auth.GithubAuthProvider();
  1. 可选:添加 OAuth 范围。范围指定您要从 GitHub 请求哪些数据。更敏感的数据可能需要特定范围。如需确定您的应用所需的范围,请参阅提供商的文档

    JavaScript

    provider.addScope('repo');
    
  1. 可选:对身份验证流程进行本地化。您可以指定语言,也可以使用设备的默认语言:

    JavaScript

    firebase.auth().languageCode = 'fr_FR';
    // To apply the default browser preference instead of
    // explicitly setting it.
    // firebase.auth().useDeviceLanguage();
    
  2. 可选:指定其他自定义 OAuth 参数。这些参数是针对 GitHub 的,通常用于自定义身份验证体验。

    JavaScript

    provider.setCustomParameters({
      'allow_signup': 'false'
    });
    

    您无法传递 OAuth 或 Identity Platform 预留的参数。

  3. 使用 GitHub 提供商对象让用户登录。您可以打开一个弹出式窗口,也可以重定向当前网页。对于移动设备用户而言,重定向更为便捷。

    如需显示弹出式窗口,请调用 signInWithPopup()

    JavaScript

    firebase.auth().signInWithPopup(provider).then(function(result) {
      // This gives you a GitHub Access Token. You can use it to access the GitHub API.
      var token = result.credential.accessToken;
      // The signed-in user info.
      var user = result.user;
      // ...
    }).catch(function(error) {
      // Handle Errors here.
      var errorCode = error.code;
      var errorMessage = error.message;
      // The email of the user's account used.
      var email = error.email;
      // The firebase.auth.AuthCredential type that was used.
      var credential = error.credential;
      // ...
    });

    如需重定向页面,请先调用 signInWithRedirect()

    JavaScript

    firebase.auth().signInWithRedirect(provider);

    然后,在网页加载时调用 getRedirectResult() 来检索 GitHub 令牌:

    JavaScript

    firebase.auth().getRedirectResult().then(function(result) {
      if (result.credential) {
        // This gives you a GitHub Access Token. You can use it to access the GitHub API.
        var token = result.credential.accessToken;
        // ...
      }
      // The signed-in user info.
      var user = result.user;
    }).catch(function(error) {
      // Handle Errors here.
      var errorCode = error.code;
      var errorMessage = error.message;
      // The email of the user's account used.
      var email = error.email;
      // The firebase.auth.AuthCredential type that was used.
      var credential = error.credential;
      // ...
    });

获得访问令牌后,您就可以使用它来调用 GitHub API。例如:

REST

curl -H "Authorization: Bearer [TOKEN]" https://api.github.com/gists/starred

手动让用户登录

如果您不想使用 Client SDK,也可以手动处理登录流程:

  1. 按照开发者文档中的步骤将 GitHub 身份验证机制集成到您的应用中。

  2. 使用您在上一步中实现的流程让用户通过 GitHub 登录。

  3. 用您从 GitHub 收到的令牌交换 Identity Platform 凭据:

    var credential = firebase.auth.GithubAuthProvider.credential(token);
    
  4. 使用该凭据让用户通过 Identity Platform 登录:

    firebase.auth().signInWithCredential(credential).catch(function(error) {
      // Handle Errors here.
      var errorCode = error.code;
      var errorMessage = error.message;
      // The email of the user's account used.
      var email = error.email;
      // The firebase.auth.AuthCredential type that was used.
      var credential = error.credential;
      // ...
    });
    

后续步骤