Meteor.js 中文网

Appearance

OAuth 服务配置 ​

¥OAuth Services Configuration

Meteor 内置支持与多个常用服务的 OAuth 身份验证。本指南将帮助你为 Meteor 应用设置 OAuth 提供程序。

¥Meteor provides built-in support for OAuth authentication with several popular services. This guide will help you set up OAuth providers for your Meteor application.

配置 ​

¥Configuration

向 OAuth 提供程序注册应用后，你需要在 Meteor 应用中配置凭据。有几种方法可以实现这一点：

¥After registering your application with an OAuth provider, you need to configure the credentials in your Meteor app. There are several ways to do this:

使用 settings.json（推荐） ​

¥Using settings.json (Recommended)

在你的 settings.json 中添加：

¥In your settings.json add:

json
{
  "packages": {
    "service-configuration": {
      "facebook": {
        "appId": "YOUR_APP_ID",
        "secret": "YOUR_APP_SECRET"
      },
      "google": {
        "clientId": "YOUR_CLIENT_ID",
        "secret": "YOUR_CLIENT_SECRET"
      },
      "github": {
        "clientId": "YOUR_CLIENT_ID",
        "secret": "YOUR_CLIENT_SECRET"
      },
      "twitter": {
        "consumerKey": "YOUR_CONSUMER_KEY",
        "secret": "YOUR_CONSUMER_SECRET"
      },
      "meetup": {
        "clientId": "YOUR_CLIENT_ID",
        "secret": "YOUR_CLIENT_SECRET"
      },
      "weibo": {
        "clientId": "YOUR_CLIENT_ID",
        "secret": "YOUR_CLIENT_SECRET"
      },
      "meteor-developer": {
        "clientId": "YOUR_CLIENT_ID",
        "secret": "YOUR_CLIENT_SECRET"
      }
    }
  }
}

每个服务还有一个可选设置 loginStyle，可以设置为 redirect 或 popup。

¥Another optional setting by each service is loginStyle which can be set to redirect or popup.

然后使用以下命令启动你的应用：

¥Then start your app with:

bash
meteor --settings settings.json

除了官方服务之外，你还可以通过 service-configuration 包配置社区/自定义 OAuth 服务。

¥In addition to the official services, you can also configure community/custom OAuth services through the service-configuration package as well.

使用 ServiceConfiguration（编程方式） ​

¥Using ServiceConfiguration (Programmatic)

你还可以在服务器代码中以编程方式配置 OAuth 服务：

¥You can also configure OAuth services programmatically in your server code:

javascript
import { ServiceConfiguration } from 'meteor/service-configuration';

// Configure Facebook
ServiceConfiguration.configurations.upsertAsync(
  { service: 'facebook' },
  {
    $set: {
      appId: 'YOUR_APP_ID',
      secret: 'YOUR_APP_SECRET'
    }
  }
);

// Configure Google
ServiceConfiguration.configurations.upsertAsync(
  { service: 'google' },
  {
    $set: {
      clientId: 'YOUR_CLIENT_ID',
      secret: 'YOUR_CLIENT_SECRET'
    }
  }
);

Facebook ​

设置 Facebook OAuth ​

¥Setting up Facebook OAuth

  1. 访问 https://developers.facebook.com/apps

    ¥Visit https://developers.facebook.com/apps

  2. 点击 "创建应用" 并填写所需信息。

    ¥Click "Create App" and fill out the required information.

  3. 在“用例”中选择“使用 Facebook 登录验证用户身份并请求数据”。

    ¥In Use cases select Authenticate and request data from users with Facebook Login

  4. 在应用控制面板中，点击 "添加产品" 并找到 "Facebook 登录"，然后点击 "设置"。

    ¥In the app dashboard, click "Add Product" and find "Facebook Login", then click "Set Up"

  5. 选择 "Web" 作为平台

    ¥Select "Web" as your platform

  6. 在左侧边栏的 "Facebook 登录 > 设置" 中，将 "有效的 OAuth 重定向 URI" 设置为 YOUR_SITE_URL/_oauth/facebook（例如，http://localhost:3000/_oauth/facebook），然后点击 "保存更改"。

    ¥In the "Facebook Login > Settings" from the left sidebar, set "Valid OAuth Redirect URIs" to YOUR_SITE_URL/_oauth/facebook (e.g., http://localhost:3000/_oauth/facebook) and click "Save Changes"

  7. 前往左侧边栏中的 "设置 > 基本"

    ¥Go to "Settings > Basic" in the left sidebar

8 记下你的 "应用 ID" 和 "应用密钥"（点击 "显示" 显示应用密钥）。你需要以下配置信息：

¥8Note down your "App ID" and "App Secret" (click "Show" to reveal the App Secret). You'll need these for configuration

配置 ​

¥Configuration

添加到你的 settings.json：

¥Add to your settings.json:

json
{
  "packages": {
    "service-configuration": {
      "facebook": {
        "appId": "YOUR_APP_ID",
        "secret": "YOUR_APP_SECRET"
      }
    }
  }
}

或者通过编程方式配置：

¥Or configure programmatically:

javascript
import { ServiceConfiguration } from 'meteor/service-configuration';

await ServiceConfiguration.configurations.upsertAsync(
  { service: 'facebook' },
  {
    $set: {
      appId: 'YOUR_APP_ID',
      secret: 'YOUR_APP_SECRET'
    }
  }
);

Google ​

设置 Google OAuth ​

¥Setting up Google OAuth

  1. 访问 https://console.cloud.google.com/

    ¥Visit https://console.cloud.google.com/

  2. 创建一个新项目或选择一个现有项目

    ¥Create a new project or select an existing one

  3. 在左侧边栏中，转到 "API 和服务" > "OAuth 授权屏幕"

    ¥In the left sidebar, go to "APIs & Services" > "OAuth consent screen"

  4. 配置授权屏幕：选择 "外部" 用户类型，输入你的应用名称、用户支持邮箱和开发者联系邮箱，然后点击 "保存并继续"

    ¥Configure the consent screen: select "External" user type, enter your app name, user support email, and developer contact email, then click "Save and Continue"

  5. 跳过 "范围" 步骤（或根据需要添加作用域），然后点击 "保存并继续"

    ¥Skip the "Scopes" step (or add scopes if needed) and click "Save and Continue"

  6. 如有需要，添加测试用户，然后单击 "保存并继续"

    ¥Add test users if needed, then click "Save and Continue"

  7. 在左侧边栏中，转到 "凭据" 并单击 "创建凭据" > "OAuth 客户端 ID"

    ¥In the left sidebar, go to "Credentials" and click "Create Credentials" > "OAuth client ID"

  8. 选择 "Web 应用" 作为应用类型

    ¥Select "Web application" as the application type

  9. 将你的网站 URL 添加到 "已授权的 JavaScript 来源"（例如，http://localhost:3000）

    ¥Add your site URL to "Authorized JavaScript origins" (e.g., http://localhost:3000)

  10. 将 YOUR_SITE_URL/_oauth/google 添加到 "已授权的重定向 URI"（例如，http://localhost:3000/_oauth/google）

    ¥Add YOUR_SITE_URL/_oauth/google to "Authorized redirect URIs" (e.g., http://localhost:3000/_oauth/google)

  11. 点击 "创建" 并从弹出的窗口中记下你的 "客户端 ID" 和 "客户端密钥"。

    ¥Click "Create" and note down your "Client ID" and "Client Secret" from the popup

配置 ​

¥Configuration

添加到你的 settings.json：

¥Add to your settings.json:

json
{
  "packages": {
    "service-configuration": {
      "google": {
        "clientId": "YOUR_CLIENT_ID",
        "secret": "YOUR_CLIENT_SECRET"
      }
    }
  }
}

或者通过编程方式配置：

¥Or configure programmatically:

javascript
import { ServiceConfiguration } from 'meteor/service-configuration';

await ServiceConfiguration.configurations.upsertAsync(
  { service: 'google' },
  {
    $set: {
      clientId: 'YOUR_CLIENT_ID',
      secret: 'YOUR_CLIENT_SECRET'
    }
  }
);

GitHub ​

设置 GitHub OAuth ​

¥Setting up GitHub OAuth

  1. 访问 https://github.com/settings/applications/new

    ¥Visit https://github.com/settings/applications/new

  2. 将首页 URL 设置为你的网站 URL（例如，开发环境使用 http://localhost:3000，生产环境使用 https://yourdomain.com）

    ¥Set Homepage URL to your site URL (e.g., http://localhost:3000 for development or https://yourdomain.com for production)

  3. 将授权回调 URL 设置为 YOUR_SITE_URL/_oauth/github（例如，http://localhost:3000/_oauth/github）

    ¥Set Authorization callback URL to YOUR_SITE_URL/_oauth/github (e.g., http://localhost:3000/_oauth/github)

  4. 点击 "注册应用"

    ¥Click "Register application"

  5. 记下你的客户端 ID 和客户端密钥。

    ¥Note down your Client ID and Client Secret

配置 ​

¥Configuration

添加到你的 settings.json：

¥Add to your settings.json:

json
{
  "packages": {
    "service-configuration": {
      "github": {
        "clientId": "YOUR_CLIENT_ID",
        "secret": "YOUR_CLIENT_SECRET"
      }
    }
  }
}

或者通过编程方式配置：

¥Or configure programmatically:

javascript
import { ServiceConfiguration } from 'meteor/service-configuration';

await ServiceConfiguration.configurations.upsertAsync(
  { service: 'github' },
  {
    $set: {
      clientId: 'YOUR_CLIENT_ID',
      secret: 'YOUR_CLIENT_SECRET'
    }
  }
);

X/Twitter ​

设置 X/Twitter OAuth ​

¥Setting up X/Twitter OAuth

  1. 访问 https://developer.x.com/en/portal/dashboard 并登录

    ¥Visit https://developer.x.com/en/portal/dashboard and sign in

  2. 创建一个新项目和应用（或选择一个现有项目和应用）

    ¥Create a new project and app (or select an existing one)

  3. 在你的应用设置中，点击 "用户身份验证设置" 下的 "设置"

    ¥In your app settings, click on "Set up" under "User authentication settings"

  4. 启用 "OAuth 1.0a"（Meteor 必需）

    ¥Enable "OAuth 1.0a" (required for Meteor)

  5. 将 "回调 URI / 重定向 URL" 设置为 YOUR_SITE_URL/_oauth/twitter（例如，http://localhost:3000/_oauth/twitter）

    ¥Set "Callback URI / Redirect URL" to YOUR_SITE_URL/_oauth/twitter (e.g., http://localhost:3000/_oauth/twitter)

  6. 将 "网站 URL" 设置为你的网站 URL（例如，http://localhost:3000）

    ¥Set "Website URL" to your site URL (e.g., http://localhost:3000)

  7. 点击 "保存"

    ¥Click "Save"

  8. 前往 "密钥和令牌" 选项卡并记下你的 "API 密钥"（消费者密钥）和 "API 密钥密钥"（消费者密钥）

    ¥Go to the "Keys and tokens" tab and note down your "API Key" (Consumer Key) and "API Key Secret" (Consumer Secret)

配置 ​

¥Configuration

添加到你的 settings.json：

¥Add to your settings.json:

json
{
  "packages": {
    "service-configuration": {
      "twitter": {
        "consumerKey": "YOUR_CONSUMER_KEY",
        "secret": "YOUR_CONSUMER_SECRET"
      }
    }
  }
}

或者通过编程方式配置：

¥Or configure programmatically:

javascript
import { ServiceConfiguration } from 'meteor/service-configuration';

await ServiceConfiguration.configurations.upsertAsync(
  { service: 'twitter' },
  {
    $set: {
      consumerKey: 'YOUR_CONSUMER_KEY',
      secret: 'YOUR_CONSUMER_SECRET'
    }
  }
);

Meetup ​

设置 Meetup OAuth ​

¥Setting up Meetup OAuth

  1. 访问 [https://www.meetup.com/api/oauth/list/](https://www.meetup.com/api/oauth/list//) 并登录

    ¥Visit https://www.meetup.com/api/oauth/list/ and sign in

  2. 点击 "创建新客户端"

    ¥Click "Create new client"

  3. 将 "客户端名称" 设置为你的应用名称

    ¥Set the "Client name" to the name of your application

  4. 将 "应用网站" 设置为你的网站 URL

    ¥Set the "Application Website" to your site URL

  5. 将 "重定向 URI" 设置为你的网站 URL（例如，） http://localhost:3000）。不要在此 URL 后附加路径

    ¥Set the "Redirect URI" to your site URL (e.g., http://localhost:3000). Do not append a path to this URL

  6. 填写所有其他必填字段。

    ¥Fill out all the other required fields.

  7. 点击 "创建" 并记下你的 "密钥"（客户端 ID）和 "密钥"（客户端密钥）。

    ¥Click "Create" and note down your "Key" (Client ID) and "Secret" (Client Secret)

配置 ​

¥Configuration

添加到你的 settings.json：

¥Add to your settings.json:

json
{
  "packages": {
    "service-configuration": {
      "meetup": {
        "clientId": "YOUR_CLIENT_ID",
        "secret": "YOUR_CLIENT_SECRET"
      }
    }
  }
}

或者通过编程方式配置：

¥Or configure programmatically:

javascript
import { ServiceConfiguration } from 'meteor/service-configuration';

await ServiceConfiguration.configurations.upsertAsync(
  { service: 'meetup' },
  {
    $set: {
      clientId: 'YOUR_CLIENT_ID',
      secret: 'YOUR_CLIENT_SECRET'
    }
  }
);

微博 ​

¥Weibo

微博目前已弃用，团队正在寻找维护者。

¥Weibo is currently deprecated and the team is looking for maintainers for this package.

设置微博 OAuth ​

¥Setting up Weibo OAuth

  1. 访问 https://open.weibo.com/apps 并登录（谷歌浏览器的自动翻译功能在这里效果很好）

    ¥Visit https://open.weibo.com/apps and sign in (Google Chrome's automatic translation works well here)

  2. 点击 "创建应用"（创建应用），然后选择 "网页应用"（Web 应用）。

    ¥Click "创建应用" (Create Application) and select "网页应用" (Web Application)

  3. 使用你的应用详细信息填写注册表单

    ¥Complete the registration form with your app details

  4. 完成电子邮件验证流程

    ¥Complete the email verification process

  5. 在你的应用控制面板中，转到 "应用信息" > "高级信息"（应用信息 > 高级信息）

    ¥In your app dashboard, go to "应用信息" > "高级信息" (Application Info > Advanced Information)

  6. 将 "OAuth 2.0 授权回调页"（OAuth2.0 重定向 URI）设置为 YOUR_SITE_URL/_oauth/weibo（例如，http://localhost:3000/_oauth/weibo）

    ¥Set "OAuth2.0 授权回调页" (OAuth2.0 Redirect URI) to YOUR_SITE_URL/_oauth/weibo (e.g., http://localhost:3000/_oauth/weibo)

  7. 在 "应用信息" > "基本信息"（应用信息 > 基本信息）中，记下你的 "应用密钥"（客户端 ID）和 "应用密钥"（客户端密钥）。

    ¥In "应用信息" > "基本信息" (Application Info > Basic Information), note down your "App Key" (Client ID) and "App Secret" (Client Secret)

配置 ​

¥Configuration

添加到你的 settings.json：

¥Add to your settings.json:

json
{
  "packages": {
    "service-configuration": {
      "weibo": {
        "clientId": "YOUR_CLIENT_ID",
        "secret": "YOUR_CLIENT_SECRET"
      }
    }
  }
}

或者通过编程方式配置：

¥Or configure programmatically:

javascript
import { ServiceConfiguration } from 'meteor/service-configuration';

await ServiceConfiguration.configurations.upsertAsync(
  { service: 'weibo' },
  {
    $set: {
      clientId: 'YOUR_CLIENT_ID',
      secret: 'YOUR_CLIENT_SECRET'
    }
  }
);

Meteor 开发者账号 ​

¥Meteor Developer Accounts

设置 Meteor Developer OAuth ​

¥Setting up Meteor Developer OAuth

  1. 访问 https://beta.galaxycloud.app/ 并登录

    ¥Visit https://beta.galaxycloud.app/ and sign in

  2. 前往“设置”->“授权域”并添加新域

    ¥Go to Settings -> Authorized Domains and Add New Domain

  3. 将 "OAuth 重定向 URL" 设置为 YOUR_SITE_URL/_oauth/meteor-developer（例如，http://localhost:3000/_oauth/meteor-developer）

    ¥Set the "OAuth Redirect URL" to YOUR_SITE_URL/_oauth/meteor-developer (e.g., http://localhost:3000/_oauth/meteor-developer)

  4. 点击 "创建" 并记下你的 "客户端 ID" 和 "客户端密钥"。

    ¥Click "Create" and note down your "Client ID" and "Client Secret"

配置 ​

¥Configuration

添加到你的 settings.json：

¥Add to your settings.json:

json
{
  "packages": {
    "service-configuration": {
      "meteor-developer": {
        "clientId": "YOUR_CLIENT_ID",
        "secret": "YOUR_CLIENT_SECRET"
      }
    }
  }
}

或者通过编程方式配置：

¥Or configure programmatically:

javascript
import { ServiceConfiguration } from 'meteor/service-configuration';

await ServiceConfiguration.configurations.upsertAsync(
  { service: 'meteor-developer' },
  {
    $set: {
      clientId: 'YOUR_CLIENT_ID',
      secret: 'YOUR_CLIENT_SECRET'
    }
  }
);

社区服务 ​

¥Community services

你可以按照上述方式为社区 OAuth 提供程序添加设置。请查阅 Meteor 的文档，了解键的命名规则以及其他特殊行为。如果这些提供商支持 *-config-ui，你可以在那里找到相关说明。

¥You can add settings for community OAuth providers in the same manner as above. Just check with their documentation for the naming of the keys and any other exceptional behavior. If those providers have *-config-ui you can find the instructions there.