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

页面摘要： Instagram Basic Display API 已于 2024 年 12 月 4 日弃用。Strapi 内置的 Instagram 提供方不再可用，需要改用 Meta 的 Instagram Business Login API。

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

WARNING

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

已弃用的提供方

Instagram Basic Display API 已于 2024 年 12 月 4 日被 Meta 关闭。Strapi 内置的 Instagram 提供方依赖该 API，因此不再可用。Meta 的替代方案是 Instagram Business Login，它需要一个不同的身份验证流程。在 Strapi 更新提供方实现之前，开箱即用的 Instagram 身份验证不可用。以下设置步骤仅供参考。

Instagram 配置

NOTE

Facebook 不接受 localhost URL。

使用 ngrok 来提供后端应用。

ngrok http 1337

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

  1. 访问开发者应用列表页面，地址为 https://developers.facebook.com/apps/
  2. 点击 Add a New App（添加新应用）按钮
  3. 在弹窗中填写 Display Name（显示名称）并创建应用
  4. 设置一个 Instagram 产品
  5. 在左侧菜单中点击 PRODUCTS > Instagram > Basic Display（产品 > Instagram > Basic Display）链接
  6. 然后点击 Create new application（创建新应用）按钮（并确认弹窗）
  7. 填写信息（替换为你自己的 ngrok URL）：
    • Valid OAuth Redirect URIs（有效的 OAuth 重定向 URI）：https://65e60559.ngrok.io/api/connect/instagram/callback
    • Deauthorize（取消授权）：https://65e60559.ngrok.io
    • Data Deletion Requests（数据删除请求）：https://65e60559.ngrok.io
  8. 在 App Review for Instagram Basic Display（Instagram Basic Display 应用审核）中，为 instagram_graph_user_profile 点击 Add to submission（添加到提审）
  9. 你应该能看到自己的 Application ID 和 secret，请将它们保存以备后用

Strapi 配置

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

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