在基于Cognito的PWA中实现登录跳转至原生应用

1. 配置Facebook开发者平台 #

• 登录Facebook开发者后台，找到目标应用，进入产品 > Facebook登录 > 设置
• 在有效的OAuth重定向URI中添加Cognito的回调URL，同时开启使用Facebook登录的原生应用选项
• 进入高级设置，开启强制使用原生授权流程（具体选项以Facebook后台最新界面为准），让移动端优先唤起原生应用

2. 调整Cognito用户池身份提供商设置 #

• 进入AWS控制台的Cognito用户池，找到对应的Facebook身份提供商
• 确认身份提供商的授权范围包含public_profile、email等必要权限，且回调URL与Facebook后台配置一致
• 检查Cognito的应用客户端设置，确保已启用Facebook作为身份提供商，且回调/注销URL配置正确

3. 配置AWS Amplify前端代码 #

• 在Amplify认证配置中，指定redirectSignIn和redirectSignOut为你的PWA域名，确保移动端环境下Amplify触发原生跳转逻辑
• 通过自定义Amplify的Auth配置，将oauth参数的responseType设为code（授权码流程更适配原生跳转），示例代码：

Amplify.configure({
  Auth: {
    region: '你的AWS区域',
    userPoolId: '你的用户池ID',
    userPoolWebClientId: '你的应用客户端ID',
    oauth: {
      domain: '你的Cognito域名',
      scope: ['email', 'openid', 'profile'],
      redirectSignIn: 'https://你的PWA域名/login/callback',
      redirectSignOut: 'https://你的PWA域名/logout',
      responseType: 'code'
    }
  }
});

• 在PWA的manifest.json中配置scope和start_url，确保应用在移动端被正确安装，以便原生应用授权完成后能回调返回

注意事项 #

• 需在真实移动端设备上测试，模拟器可能无法正常唤起Facebook原生应用
• 确保Facebook应用的应用类型设置为「原生」或「混合应用」，而非纯网页应用
• 若移动端用户未安装Facebook原生应用，会自动 fallback 到网页版授权流程，无需额外处理

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