React Native Expo中Amplify的Google登录signInWithRedirect异常

问题详情 #

在React Native Expo项目中，借助Amplify和AWS Cognito实现谷歌社交登录时，调用signInWithRedirect()函数未弹出内嵌浏览器，反而触发错误：

OAuthSignInException: Error: The @aws-amplify/rtn-web-browser package doesn't seem to be linked. Make sure:

• 安装包后重建了应用
• 未使用Expo Go

终端输出相同错误提示。已尝试重建应用并改用开发构建版本替代Expo Go，问题仍未解决。

相关代码 #

登录函数 #

const handleGoogleLogin = async () => {
  try {
    await signInWithRedirect()
  } catch(err) {
    console.log(err)
  }
}

App.js 配置 #

import { Amplify } from 'aws-amplify';

Amplify.configure({
  Auth: {
    Cognito: {
      // Amazon Cognito用户池ID
      userPoolId:'us-east-2_******',

      // 可选 - Amazon Cognito Web客户端ID（26位字母数字字符串）
      userPoolClientId:'4rios************',
      // 仅联合认证必填 - Amazon Cognito身份池ID
      // identityPoolId:'us-east-2:**************************',

      // 可选 - Auth.signUp启用自动登录时使用
      // 'code'用于Auth.confirmSignUp，'link'用于邮箱链接验证
      signUpVerificationMethod: 'code', // 'code' | 'link'
      loginWith: {
        // 可选 - 托管UI配置
        oauth: {
          domain:'https://f*******.auth.us-east-2.amazoncognito.com',

          scopes: [
            'email'
          ],
          redirectSignIn: ['f*****://'],
          redirectSignOut: ['f****://'],
          responseType: 'token', // or 'token',
          providers: {
            Google: {
              clientId: '*************-*****************.apps.googleusercontent.com',
              responseType: 'code'  // Optional, defaults to 'code'
            },

          }
        }
      }
    }
  }
});

解决方案 #

1. 强制安装并配置@aws-amplify/rtn-web-browser
   执行安装命令：

   npx expo install @aws-amplify/rtn-web-browser
   

   安装完成后必须完全重建开发构建包（不能仅热重载）。

2. 统一Amplify相关包版本
   避免版本冲突，执行命令同步最新兼容版本：

   npm install aws-amplify@latest @aws-amplify/rtn-web-browser@latest
   

3. 清理并重新生成开发构建
   执行以下命令彻底重建项目：

   npx expo prebuild --clean
   npx expo run:android # 针对Android环境
   # 或针对iOS环境：npx expo run:ios
   

4. 统一OAuth的responseType配置
   全局oauth配置与Google provider的responseType需保持一致，修改后示例：

   oauth: {
     domain:'https://f*******.auth.us-east-2.amazoncognito.com',
     scopes: ['email'],
     redirectSignIn: ['f*****://'],
     redirectSignOut: ['f****://'],
     responseType: 'code', // 和Google provider保持一致
     providers: {
       Google: {
         clientId: '*************-*****************.apps.googleusercontent.com'
         // 此处可省略responseType，继承全局配置
       }
     }
   }
   

5. 验证深链接配置有效性
   确认redirectSignIn/redirectSignOut中的scheme已在项目中正确配置：

   • 在app.json的expo.scheme字段中设置对应的scheme（即f*****）
   • 检查iOS的Info.plist或Android的AndroidManifest.xml中是否已自动生成对应URL scheme配置（Expo prebuild会自动处理，若未生成需手动补充）

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