React-Native Expo 应用程序 Auth0 登录，AuthSession - authURL 失败

Question

我正在尝试使用 AuthSession 设置登录到我的 React Native Expo 应用程序。

我不断收到此错误：ValidationError：子“authUrl”失败，因为 [“authUrl”必须是有效的 uri]”。

奇怪的是，如果我通过控制台记录正在传递的 URI，复制它并将其粘贴到浏览器中，它就可以工作！（按预期拉出 Auth0 登录屏幕）。

为什么我在尝试从 Expo 客户端应用程序调用它时会收到此错误？

这是我的代码：

 function toQueryString(params) {
  return '?' + Object.entries(params)
    .map(([key, value]) => `${encodeURIComponent(key)}=${encodeURIComponent(value)}`)
    .join('&');
}

class SignInScreen extends React.Component {

logIn = async () => {
  const redirectUrl = AuthSession.getRedirectUrl();
  console.log(`Redirect URL: ${redirectUrl}`);

  // Structure the auth parameters and URL
  const queryParams = toQueryString({
    client_id: auth0ClientId,
    redirect_uri: redirectUrl,
    response_type: 'id_token', // id_token will return a JWT token
    scope: 'openid profile', // retrieve the user's profile
    nonce: 'nonce', // ideally, this will be a random value
  });
  const authUrl = `${auth0Domain}/authorize` + queryParams;

  // Perform the authentication
  const response = await AuthSession.startAsync({ authUrl });
  console.log('Authentication response', response);

  if (response.type === 'success') {
    this.handleResponse(response.params);
  }
};

handleResponse = (response) => {
  if (response.error) {
    Alert('Authentication error', response.error_description || 'something went wrong');
    return;
  }

 console.log(response.id_token)
};

Answer 1

发布后不久我就明白了这一点。这就是我为了让它发挥作用所做的事情。

我正在使用：

 const auth0Domain = 'myapp.auth0.com'

我应该一直使用：

const auth0Domain = 'https://myapp.auth0.com'

另外更新，请务必直接在“expo”下将一个方案添加到您的 app.json 中，该方案应该是您的 slug 名称全部小写，不要忘记它必须全部小写。另外，不要忘记这个新的 app.json 无法通过 OTA 更新，必须提交到应用商店。如果您尝试在没有更新包含该方案的 app.json 的情况下使用此 Auth0，那么您将收到 safari 错误，提示“safari 无法打开此页面，因为它是无效的 url”或类似内容。当您看到此内容时，请记住这不是您的重定向 URL 的问题（假设您使用的是样板 AuthSession.getRedirectURL() 方法，并且您将相同的重定向 URL 放入 Auth0 设置中的回调中）。如果您执行了这两件事，那么您会看到此错误，因为您尚未在应用程序商店或测试飞行版本上更新您的方案。