在 App Engine 上登录用户

本教程介绍如何使用 Identity Platform、App Engine 标准环境和 Datastore 检索、验证和存储第三方凭据。

本文档将介绍一款名为 Firenotes 的简单笔记应用，该应用可将用户笔记存储在用户自己的个人笔记本中。笔记本按用户存储，并由每个用户唯一的 Identity Platform ID 进行标识。该应用包含以下组件：

  • 前端 - 前端负责配置登录界面并检索 Identity Platform ID。它还会处理身份验证状态变更并允许用户查看其笔记。

  • FirebaseUI - 是一个具有普适性的开源解决方案，可简化身份验证和界面任务。SDK 会处理用户登录、将多个提供商关联到一个账号、恢复密码等。FirebaseUI 会实施身份验证最佳做法，可带来流畅、安全的登录体验。

  • 后端 - 后端负责验证用户的身份验证状态，并返回用户个人资料信息以及用户的笔记。

该应用使用 NDB 客户端库在 Datastore 中存储用户凭据，但您可以将凭据存储在您选择的数据库中。

Firenotes 基于 Flask Web 应用框架。该示例应用之所以使用 Flask，是因为该框架简单易用，但无论您使用哪种框架，此处所探讨的概念和技术都适用。

目标

学完本教程后，您将可以完成以下任务：

  • 使用 FirebaseUI for Identity Platform 配置界面。
  • 获取 Identity Platform ID 令牌并使用服务器端身份验证对其进行验证。
  • 将用户凭据和关联的数据存储到 Datastore 中。
  • 使用 NDB 客户端库查询数据库。
  • 将应用部署到 App Engine。

费用

本教程使用 Google Cloud的可计费组件，包括：

  • Datastore
  • Identity Platform

您可使用价格计算器根据您的预计使用情况来估算费用。

Google Cloud 新用户可能有资格申请免费试用。

准备工作

  1. 安装 Git、Python 2.7 和 virtualenv。如需详细了解如何设置 Python 开发环境（例如安装最新版本的 Python），请参阅 Google Cloud的设置 Python 开发环境。

  2. In the Google Cloud console, on the project selector page, select or create a Google Cloud project.

    Roles required to select or create a project

    • Select a project: Selecting a project doesn't require a specific IAM role—you can select any project that you've been granted a role on.
    • Create a project: To create a project, you need the Project Creator role (roles/resourcemanager.projectCreator), which contains the resourcemanager.projects.create permission. Learn how to grant roles.

    Go to project selector

  3. 安装 Google Cloud CLI。

  4. 配置 gcloud CLI 以使用您的联合身份。

    如需了解详情，请参阅使用联合身份登录 gcloud CLI。

  5. 如需初始化 gcloud CLI，请运行以下命令： 

    gcloud init

如果您已为其他项目安装并初始化 SDK，请将 gcloud 项目设置为您用于 Firenotes 的 App Engine 项目 ID。如需了解使用 gcloud 工具更新项目需要用到的特定命令，请参阅管理 Google Cloud SDK 配置。

克隆示例应用

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

  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 应用中。

      // This code is for illustration purposes only.

// 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 文件，在 env_variables 部分中添加 GOOGLE_CLOUD_PROJECT : 'PROJECT_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.

# This code is designed for Python 2.7 and
# the App Engine first-generation Runtime which has reached End of Support.

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 登录微件。

    // This code is for illustration purposes only.

// 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