在 App Engine 上登录用户

克隆示例应用

要将示例下载到本地计算机，请执行以下操作：

1. 将示例应用代码库克隆到本地计算机：

   git clone https://github.com/GoogleCloudPlatform/python-docs-samples.git

   或者，您也可以下载该示例的 zip 文件并将其解压缩。

2. 转到包含示例代码的目录：

   cd python-docs-samples/appengine/standard/firebase/firenotes
   

添加界面

如需配置 FirebaseUI for Identity Platform 并启用身份提供商，请执行以下操作：

1. 按照以下步骤将 Identity Platform 添加到您的应用：

   1. 前往 Google Cloud 控制台。
      前往 Google Cloud 控制台
   2. 选择您要使用的 Google Cloud 项目：
      • 如果您已有项目，请在页面顶部的选择组织下拉列表中选择该项目。
      • 如果您还没有 Google Cloud 项目，请在 Google Cloud 控制台中创建新项目。
   3. 前往 Google Cloud 控制台中的 Identity Platform Marketplace 页面。
      转到 Identity Platform Marketplace 页面
   4. 在 Identity Platform Marketplace 页面上，点击启用客户身份 (Enable Customer Identity)。
   5. 前往 Google Cloud 控制台中的客户身份用户页面。
      转到“用户”页面
   6. 点击右上角的应用设置详情。

   7. 将应用设置详情复制到您的 Web 应用中。

      // Obtain the following from the "Add Firebase to your web app" dialogue
      // Initialize Firebase
      var config = {
        apiKey: "<API_KEY>",
        authDomain: "<PROJECT_ID>.firebaseapp.com",
        databaseURL: "https://<DATABASE_NAME>.firebaseio.com",
        projectId: "<PROJECT_ID>",
        storageBucket: "<BUCKET>.appspot.com",
        messagingSenderId: "<MESSAGING_SENDER_ID>"
      };

2. 修改 backend/app.yaml 文件，并在环境变量中输入您的 Google Cloud 项目 ID：

   # Copyright 2021 Google LLC
   #
   # Licensed under the Apache License, Version 2.0 (the "License");
   # you may not use this file except in compliance with the License.
   # You may obtain a copy of the License at
   #
   #      http://www.apache.org/licenses/LICENSE-2.0
   #
   # Unless required by applicable law or agreed to in writing, software
   # distributed under the License is distributed on an "AS IS" BASIS,
   # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
   # See the License for the specific language governing permissions and
   # limitations under the License.
   
   runtime: python27
   api_version: 1
   threadsafe: true
   service: backend
   
   handlers:
   - url: /.*
     script: main.app
   
   env_variables:
     GAE_USE_SOCKETS_HTTPLIB : 'true'
   

3. 在 frontend/main.js 文件中，通过选择要向用户提供的提供商来配置 FirebaseUI 登录微件。

   // Firebase log-in widget
   function configureFirebaseLoginWidget() {
     var uiConfig = {
       'signInSuccessUrl': '/',
       'signInOptions': [
         // Leave the lines as is for the providers you want to offer your users.
         firebase.auth.GoogleAuthProvider.PROVIDER_ID,
         firebase.auth.FacebookAuthProvider.PROVIDER_ID,
         firebase.auth.TwitterAuthProvider.PROVIDER_ID,
         firebase.auth.GithubAuthProvider.PROVIDER_ID,
         firebase.auth.EmailAuthProvider.PROVIDER_ID
       ],
       // Terms of service url
       'tosUrl': '<your-tos-url>',
     };
   
     var ui = new firebaseui.auth.AuthUI(firebase.auth());
     ui.start('#firebaseui-auth-container', uiConfig);
   }

4. 在 Google Cloud 控制台中，启用您选择要保留的提供商：

   1. 前往 Google Cloud 控制台中的客户身份提供商页面。
      转到“提供商”页面
   2. 点击添加提供商。
   3. 在选择一个提供商下拉列表中，选择要使用的提供商。
   4. 点击启用旁边的按钮以启用提供商。
      • 对于第三方身份提供商，请输入提供商开发者网站上的提供商 ID 和密钥。Firebase 文档会提供 Facebook、Twitter 和 GitHub 指南“准备工作”部分中的具体说明。
      • 对于 SAML 和 OIDC 集成，请参阅 IdP 的配置。

5. 将您的网域添加到 Identity Platform 中的已获授权的网域列表中：

   1. 前往 Google Cloud 控制台中的客户身份设置页面。
      转到“设置”页面
   2. 在已获授权的网域下，点击添加网域。

   3. 按以下格式输入应用的网域：

      [PROJECT_ID].appspot.com
      

      不要在域名前添加 http://。

安装依赖项

1. 导航到 backend 目录并完成应用设置：

   cd backend/
   

2. 将依赖项安装到项目的 lib 目录中：

   pip install -t lib -r requirements.txt
   

3. 在 appengine_config.py 中，vendor.add() 方法在 lib 目录中注册库。

在本地运行应用

如需在本地运行应用，请使用 App Engine 本地开发服务器：

1. 在 main.js 中添加以下网址作为 backendHostURL：

   http://localhost:8081

2. 导航到应用的根目录。然后，启动开发服务器：

   dev_appserver.py frontend/app.yaml backend/app.yaml
   

3. 在网络浏览器中访问 http://localhost:8080/。

在服务器上对用户进行身份验证

现在您已设置了一个项目并初始化了一个用于开发的应用，接下来您可以浏览代码，以了解如何在服务器上检索和验证 Identity Platform ID 令牌。

从 Identity Platform 获取 ID 令牌

服务器端身份验证的第一步是检索要验证的访问令牌。身份验证请求通过 Identity Platform 中的 onAuthStateChanged() 监听器进行处理：

firebase.auth().onAuthStateChanged(function(user) {
  if (user) {
    $('#logged-out').hide();
    var name = user.displayName;

    /* If the provider gives a display name, use the name for the
    personal welcome message. Otherwise, use the user's email. */
    var welcomeName = name ? name : user.email;

    user.getIdToken().then(function(idToken) {
      userIdToken = idToken;

      /* Now that the user is authenicated, fetch the notes. */
      fetchNotes();

      $('#user').text(welcomeName);
      $('#logged-in').show();

    });

  } else {
    $('#logged-in').hide();
    $('#logged-out').show();

  }
});

用户登录后，回调中的 Identity Platform getToken() 方法将以 JSON Web 令牌 (JWT) 形式返回 Identity Platform ID 令牌。

在服务器上验证令牌

用户登录后，前端服务会通过 AJAX GET请求提取用户笔记本中的所有现有备注。这需要访问用户数据的授权，因此系统会使用 Bearer 架构在请求的 Authorization 标头中发送 JWT：

// Fetch notes from the backend.
function fetchNotes() {
  $.ajax(backendHostUrl + '/notes', {
    /* Set header for the XMLHttpRequest to get data from the web server
    associated with userIdToken */
    headers: {
      'Authorization': 'Bearer ' + userIdToken
    }
  })

在客户端可以访问服务器数据之前，您的服务器必须验证令牌是否已由 Identity Platform 签名。您可以使用 Python 版 Google 身份验证库验证此令牌。使用身份验证库的 verify_firebase_token 函数验证不记名令牌并提取声明：

id_token = request.headers["Authorization"].split(" ").pop()
claims = google.oauth2.id_token.verify_firebase_token(
    id_token, HTTP_REQUEST, audience=os.environ.get("GOOGLE_CLOUD_PROJECT")
)
if not claims:
    return "Unauthorized", 401

每个身份提供商都会发送一组不同的声明，但每组声明都至少包含一个带有唯一用户 ID 的 sub 声明，以及用来提供一些个人资料信息的声明（例如 name 或 email），您可以利用这些信息让您的应用带来个性化的用户体验。

在 Datastore 中管理用户数据

在对用户进行身份验证之后，您需要存储用户的数据，以便这些数据在登录会话结束后保留下来。以下部分介绍了如何将每份笔记存储为一个 Datastore 实体，并按用户 ID 将这些实体隔离开来。

创建实体以存储用户数据

您可以通过声明具有特定属性（如整数或字符串）的NDB 模型类在 Datastore 中创建实体。Datastore 按种类为实体编制索引；以 Firenotes 为例，每个实体的种类是 Note。为了便于查询，每个 Note 会和键名一起存储，键名是从上一部分的 sub 声明中获取的用户 ID。

以下代码演示了如何设置实体的属性（在创建实体时，通过模型类的构造函数方法进行设置；在创建实体后，通过分配各个属性进行设置）：

data = request.get_json()

# Populates note properties according to the model,
# with the user ID as the key name.
note = Note(parent=ndb.Key(Note, claims["sub"]), message=data["message"])

# Some providers do not provide one of these so either can be used.
note.friendly_id = claims.get("name", claims.get("email", "Unknown"))

如需将新创建的 Note 写入 Datastore，请针对 note 对象调用 put() 方法。

检索用户数据

如需检索与特定用户 ID 相关联的用户数据，请使用 NDB query() 方法在数据库中搜索同一实体组中的笔记。属于同一个组（或祖先实体路径）的实体会共用一个键名，在本例中是指用户 ID。

def query_database(user_id):
    """Fetches all notes associated with user_id.

    Notes are ordered them by date created, with most recent note added
    first.
    """
    ancestor_key = ndb.Key(Note, user_id)
    query = Note.query(ancestor=ancestor_key).order(-Note.created)
    notes = query.fetch()

    note_messages = []

    for note in notes:
        note_messages.append(
            {
                "friendly_id": note.friendly_id,
                "message": note.message,
                "created": note.created,
            }
        )

    return note_messages

然后，您可以提取查询数据并在客户端显示笔记：

// Fetch notes from the backend.
function fetchNotes() {
  $.ajax(backendHostUrl + '/notes', {
    /* Set header for the XMLHttpRequest to get data from the web server
    associated with userIdToken */
    headers: {
      'Authorization': 'Bearer ' + userIdToken
    }
  }).then(function(data){
    $('#notes-container').empty();
    // Iterate over user data to display user's notes from database.
    data.forEach(function(note){
      $('#notes-container').append($('<p>').text(note.message));
    });
  });
}

部署应用

您已成功将 Identity Platform 与 App Engine 应用集成。如需查看在实时生产环境中运行的应用，请执行以下操作：

1. 将 main.js 中的后端主机网址更改为 https://backend-dot-[PROJECT_ID].appspot.com。将 [PROJECT_ID] 替换为您的项目 ID。

2. 使用 Google Cloud SDK 命令行界面部署应用：

   gcloud app deploy backend/index.yaml frontend/app.yaml backend/app.yaml
   

3. 在 https://[PROJECT_ID].appspot.com 上实时查看应用。