使用expo-web-browser的openAuthSessionAsync无法返回应用及获取登录数据

问题说明 #

使用expo-web-browser的openAuthSessionAsync接口打开登录页面后，登录成功无法返回应用，也获取不到登录数据。

原代码问题点 #

1. 未处理openAuthSessionAsync返回的Promise，无法接收登录结果
2. 可能缺少App Scheme配置，导致回调URL无法唤起应用
3. 登录页未正确跳转到指定的回调URL

修复方案 #

1. 正确处理Promise获取登录结果

修改signIn方法，用async/await接收异步返回的结果，并更新状态：

signIn = async () => {    
  const callbackUrl = Linking.makeUrl();
  try {
    const authResult = await WebBrowser.openAuthSessionAsync('https://..../login', callbackUrl);
    setResult(authResult);
    // 解析登录成功后的参数
    if (authResult.type === 'success') {
      const { queryParams } = Linking.parse(authResult.url);
      console.log('登录数据：', queryParams);
      // 这里可以处理token或用户信息
    }
  } catch (err) {
    console.error('登录失败：', err);
  }
}

2. 配置App Scheme

在app.json（或app.config.js）中添加自定义scheme，这是回调URL唤起应用的核心配置：

{
  "expo": {
    "scheme": "yourappscheme", // 比如设置为"myexpoauth"，确保唯一
    // 其他项目配置...
  }
}

修改后需要重启Expo Go应用，使配置生效。

3. 确保登录页正确跳转回调URL

登录后端在验证成功后，必须重定向到你传入的callbackUrl，并在URL的query参数中携带登录数据，例如：

yourappscheme://?access_token=xxxxxx&user_id=123

当WebBrowser检测到跳转到该scheme的URL时，会自动关闭并返回应用，同时将该URL作为结果返回。

4. 测试Linking唤起（可选）

如果还是无法返回应用，在手机浏览器中输入yourappscheme://test，验证是否能唤起你的Expo应用。若不能，检查scheme配置是否正确，或重新启动Expo Go。

内容的提问来源于stack exchange，提问作者mingmingming