如何使用Mongo Stitch React-Native SDK获取Google Oauth的验证代码

Question

从文档中看来，除了使用GoogleCredential构造函数外，其他方法没有其他方法可以使用authcode作为强制性参数，我应该如何获得authcode？/p>

有关[[[loginwithredirect]]的示例，请参见Facebook Authentication

另外，文档中有多个引用到称为loginwithredirect的函数，但它们不会在任何地方链接，并且在auth对象中没有属性，称为loginwithredirect。

Answer 1

确实，RN和Server SDK不支持重定向概念。您必须获得自己的authcode。

Stitch的GoogleCredential构造函数只会期望有效的服务器验证代码，以便针迹服务可以使用离线访问。

使用第三方OAuth模块

我没有运气使用RN的官方Google-Atut-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth-auth。我能够使用React-Native-native-native-nigation-nordity的React-Native-google-Signin，至少在iOS上（至少还没有尝试过Android）。安装过程有点涉及，因此请务必仔细遵循其说明！

我将展示如何使用此特定库登录。希望此信息可以应用于其他OAuth库和其他身份验证提供商（例如Facebook）。

配置googlesignin

必须指定WebClientID，并且必须在Stitch UI上的Google OAuth2配置下匹配客户端ID（请参见ScreenShot）。iosclientID可在googleservice-info中找到您下载后下载的iosclientid。最后，将其设置为true。

如果您直接使用Google iOS SDK或其他库，请注意WebClientID称为ServerClientID，而iosclientID简称为客户端。

这是我的配置代码（请参阅我的完整app.js文件）：

componentDidMount() {
  // ...
  GoogleSignin.configure({
    webClientId: '<id>', // from Stitch UI > Users > Providers > Google
    offlineAccess: true,
    iosClientId: '<id>', // CLIENT_ID in GoogleService-Info.plist
  });
}

渲染Googlesigninbutton

React-Native-Google-Signin提供了一个不错的使用按钮，我将其呈现出来（请参阅屏幕截图）：

const loginButton = <GoogleSigninButton
  style={{ width: 192, height: 48 }}
  size={GoogleSigninButton.Size.Wide}
  color={GoogleSigninButton.Color.Dark}
  onPress={this._onPressLogin}
  disabled={this.state.isSigninInProgress}
/>

从Googlesignin

给出了ServerAuthCode

我的_ONPRESSLOGIN函数使用GoogleSignin来获取ServerAuthCode。然后，它将代码传递给缝线：

_onPressLogin = async () => {
  // They recommend calling this before signIn
  await GoogleSignin.hasPlayServices();
  // Call signIn to get userInfo
  const userInfo = await GoogleSignin.signIn();
  // Check if serverAuthCode was received -- it will be null
  // if something wasn't configured correctly. Be sure to
  // log out after changing a configuration.
  const {serverAuthCode} = userInfo;
  if (serverAuthCode === null) {
    throw new Error('Failed to get serverAuthCode!');
  }
  try {
    // Pass serverAuthCode to Stitch via GoogleCredential
    const user = await this.state.client.auth.loginWithCredential(new GoogleCredential(serverAuthCode));
    console.log(`Successfully logged in as user ${user.id}`);
    this.setState({ currentUserId: user.id });
  } catch(err) {
    console.error(`Failed to log in anonymously: ${err}`);
    this.setState({ currentUserId: undefined })
  }

登录

我发现我在测试时必须登录几次（并弄清楚要使用哪些客户端ID），否则ServerAuthCode将返回null。始终可以看到注销按钮是很好的。我的注销代码看起来像这样：

_onPressLogout = async () => {
  await GoogleSignin.revokeAccess();
  await GoogleSignin.signOut();
  const user = await this.state.client.auth.logout();
  console.log(`Successfully logged out`);
  this.setState({ currentUserId: undefined })
}

我希望这会有所帮助！