Twitter 提供方在 Users & Permissions 中的设置

页面摘要： 将 Twitter（现 X）配置为 Users & Permissions 的 OAuth 提供方。由于 v1.1 API 端点不再免费提供，因此需要付费的 X Developer Portal 套餐。

本页介绍如何为 Users & Permissions 功能 设置 Twitter 提供方。

WARNING

你已阅读 Users & Permissions 提供方文档。

需要付费 API 访问权限

Twitter（现 X）在 2023 年调整了其 API 访问方式。Strapi 内置的 Twitter 提供方使用的是 v1.1 API（account/verify_credentials），该端点在免费套餐中已不再可用。你需要 X Developer Portal 上的 Basic 或 Pro 套餐 才能使用此提供方。自品牌重塑以来，开发者门户 URL 和设置流程也发生了变化。

Twitter 配置

NOTE

Twitter 不接受 localhost URL。

使用 ngrok 来提供后端应用。

ngrok http 1337

别忘了使用生成的 ngrok URL 更新后端配置文件 config/server.js 中的服务器 URL，以及你的前端应用中的服务器 URL（如果你使用 react 登录示例应用，则为环境变量 REACT_APP_BACKEND_URL）。

  1. 访问应用列表页面，地址为 https://developer.twitter.com/en/apps
  2. 点击 Create an app（创建应用）按钮
  3. 填写信息（替换为你自己的 ngrok URL）：
    • App name（应用名称）：Strapi Twitter auth
    • Application description（应用描述）：This is a demo app for Strapi auth
    • Tell us how this app will be used（告诉我们此应用将如何使用）：—— 在此处写一段足够长的说明 ——
  4. 流程结束时，你应该能看到自己的 Application ID 和 secret，请将它们保存以备后用
  5. 进入你的应用设置并点击编辑 Authentication settings（身份验证设置）
  6. 启用 3rd party authentication（第三方身份验证）和 Request email address from users（向用户请求邮箱地址）
  7. 填写信息（替换为你自己的 ngrok URL）：
    • Callback URLs（回调 URL）：https://65e60559.ngrok.io/api/connect/twitter/callback
    • Website URL（网站 URL）：https://65e60559.ngrok.io
    • Privacy policy（隐私政策）：https://d73e70e88872.ngrok.io
    • Terms of service（服务条款）：https://d73e70e88872.ngrok.io

Strapi 配置

  1. 访问 User & Permissions 提供方设置页面，地址为 http://localhost:1337/admin/settings/users-permissions/providers
  2. 点击 Twitter 提供方
  3. 填写以下信息（替换为你自己的客户端 ID 和密钥）：
    • Enable：ON
    • API Key：yfN4ycGGmKXiS1njtIYxuN5IH
    • Api Secret：Nag1en8S4VwqurBvlW5OaFyKlzqrXFeyWhph6CZlpGA2V3VR3T
    • 指向你前端应用的重定向 URL：http://localhost:3000/connect/twitter/redirect

你的配置已完成。启动后端和 react 登录示例应用，访问 http://localhost:3000 并尝试连接到你所配置的提供方。