Expo Go 与谷歌/Facebook OAuth - auth.expo.io 登录屏幕 - “未找到”

Question

我正在尝试在本机 expo 托管应用程序中设置 google oauth。 我在 Expo Go 中使用我的应用程序时仅遇到以下问题- 当我创建应用程序构建时，oauth 流程完美运行。 但是很难以这种方式开发，我需要能够通过 Expo Go 与非开发团队成员共享一个工作应用程序。我已经设置了我认为与expo go google auth 文档相同的流程描述过。 概述

• 在google console中新建一个项目，为web应用设置一个新的ClientID。 设置授权来源和重定向 uri：

其中myorg是拥有该项目的组织帐户 expo 的名称， projectname与 app.json 中的slug的值相同。

• 设置后，我得到了这个 oauth 登录方法的客户端 ID 和客户端密码。

• 在我的应用程序代码中，我按照说明使用 google 的expo-auth-session库：

import * as WebBrowser from "expo-web-browser";
import * as Google from "expo-auth-session/providers/google";

WebBrowser.maybeCompleteAuthSession();

export const OAuthButtons: React.FC = () => {
  const [request, response, promptAsync] = Google.useAuthRequest({
    expoClientId: "clientId-from-google-console.apps.googleusercontent.com",
    iosClientId: "will set this up eventually",
    androidClientId: "will set this up eventually",
  });

  return; // markup for sign in buttons

}

所以现在在我的应用程序中，当我点击谷歌登录按钮时，我得到正确打开 web 浏览器的提示：

单击它可正确打开 expo web 浏览器，但我看到一条“未找到”消息：

有关更多详细信息，当我记录request时，我得到了一些非常期望的值

"{
  "url": "https://accounts.google.com/o/oauth2/v2/auth?redirect_uri=https%3A%2F%2Fauth.expo.io%2FMyProject&client_id=id-from-console.apps.googleusercontent.com&response_type=token&state=5xWG83SsoJ&scope=openid%20https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fuserinfo.profile%20https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fuserinfo.email",
  "responseType": "token",
  "clientId": "client-id-from-console.apps.googleusercontent.com",
  "redirectUri": "https://auth.expo.io/MyProject",
  "scopes": [
    "openid",
    "https://www.googleapis.com/auth/userinfo.profile",
    "https://www.googleapis.com/auth/userinfo.email"
  ],
  "state": "5xWG83SsoJ",
  "extraParams": {},
  "codeChallengeMethod": "S256",
  "usePKCE": false
}"

这里唯一有点出乎意料的值是redirectUri和redirect_uri ，它们附加了一个/MyProject ，这与我在谷歌控制台中的重定向 uri 中输入的不完全相同。 那是怎么附加到那里的？ 这可能是问题所在吗？

据我所知，我已经按照描述设置了所有内容。 这里“未找到”到底是什么？ 这个特定的 expo 应用程序的 oauth 页面？ 我的 go 哪里设置错了？

编辑 - 与Facebook.useAuthRequest相同的问题

我也遇到了与 Facebook 提供程序模块完全相同的问题。 相似代码：

  const [facebookRequest, facebookResponse, facebookPromptAsync] =
    Facebook.useAuthRequest({
      clientId: "facebook_app_id",
      responseType: ResponseType.Code,
    });

我还尝试了在 iOS/Android 上使用 Facebook 最简单的方式使用 expo-auth-session文章中的建议来添加useProxy: true属性，但这没有区别。

  const [facebookRequest, facebookResponse, facebookPromptAsync] =
    Facebook.useAuthRequest(
      {
        clientId: "facebook_app_id",
        responseType: ResponseType.Code,
      },
      { useProxy: true }
    );

facebook 登录也会将 expo 浏览器打开到一个显示“未找到”的空页面

我在这里做错了什么？

Answer 1

你有你的originalFullName在你的 app.json 上指定吗？ 如果没有，请尝试添加它，例如originalFullName: "@your_username/your_app_name"

也许这个 github 问题可以帮助您， https://github.com/expo/expo/issues/19891 。