AWS Amplify Google 身份验证用户未重定向回答案

【问题标题】：AWS Amplify Google auth user not redirected backAWS Amplify Google 身份验证用户未重定向回
【发布时间】：2020-03-01 14:50:46
【问题描述】：

我正在尝试使用 AWS Amplify 在 React 本机应用程序中实现 Google 身份验证。我已经在我的应用中安装了 Amplify，还安装了 Auth。

我在 Google api 中有这个客户端：

授权的javascript来源：

https://inventory053721f5-053721f5-develop.auth.eu-west-1.amazoncognito.com

授权重定向 uri：

https://inventory053721f5-053721f5-develop.auth.eu-west-1.amazoncognito.com/oauth2/idpresponse

aws-exports.js：

// WARNING: DO NOT EDIT. This file is automatically generated by AWS Amplify. It will be overwritten.

const awsmobile = {
    "aws_project_region": "eu-west-1",
    "aws_cognito_identity_pool_id": "***",
    "aws_cognito_region": "eu-west-1",
    "aws_user_pools_id": "***",
    "aws_user_pools_web_client_id": "***",
    "oauth": {
        "domain": "***",
        "scope": [
            "phone",
            "email",
            "openid",
            "profile",
            "aws.cognito.signin.user.admin"
        ],
        "redirectSignIn": "inventory://",
        "redirectSignOut": "inventory://",
        "responseType": "code"
    },
    "federationTarget": "COGNITO_USER_POOLS"
};


export default awsmobile;

我的App.tsx 看起来像这样：

import React, {FunctionComponent} from 'react';
import Amplify, {Auth} from 'aws-amplify';
import {Button} from 'react-native';
import config from '../../aws-exports';

Amplify.configure(config);

export interface AppProps {}

const App: FunctionComponent<AppProps> = () => {
  return <Button title={'Login'} onPress={() => Auth.federatedSignIn()} />;
};

export default App;

发生了什么的视频：

https://imgur.com/tPEcoop

【问题讨论】：

标签： reactjs amazon-web-services react-native react-native-android aws-amplify

【解决方案1】：

设置 Amplify Auth 并配置您的 social provider 后，您还必须设置 linking 以便您的应用可以处理从 Web 浏览器返回到您的应用的回调：

请注意您在运行 amplify add auth 时为“重定向登录 uri”输入的值（例如 myapp:\\）。
对于在 iOS 上使用 react-native-cli（而不是 Expo）制作的应用，打开 Xcode 项目（在 ios 文件夹中，rnamplify.xcworkspace）。然后打开info.plist作为源代码并添加以下内容：

<key>CFBundleURLTypes</key>
<array>
  <dict>
    <key>CFBundleURLSchemes</key>
    <array>
      <string>myapp</string>
    </array>
  <dict>
</array>

对于在 Android 上使用 react-native-cli（而不是 Expo）制作的应用，在 Android Studio 中打开 android/app/main/AndroidManifest.xml 并添加以下 intent-filter：

<intent-filter android:label="filter_react_native">
  <action android:name="android.intent.action.VIEW" />
  <category android:name="android.intent.category.DEFAULT" />
  <category android:name="android.intent.category.BROWSABLE" />
  <data android:scheme="myapp" />
</intent-filter>

如果您的应用是使用 Expo 而不是 react-native-cli 制作的，那么您将不会执行上述第 2 步和第 3 步。而是打开您的 app.json 文件并将 scheme 键值对添加到“expo”属性：

{
  "expo": {
   "scheme": "myapp"
  }
}

【讨论】：

非常感谢您的详细解释！我肯定会不时查看这个答案=）

【解决方案2】：

虽然这可能不完全是您的情况。如果您使用的是 amplify CLI，请确保您的重定向登录和注销 URI 设置正确。

你可以通过运行amplify update auth来调整它

【讨论】：