EXPO AuthSession 在 Android 设备上返回解雇

问题描述 投票:0回答:2

我正在使用 Expo AuthSession 通过 IdentityServer4 实现登录我的应用程序。

当我尝试使用我的 Google 帐户登录 IdentityServer 时,仅在 ANDROID 中遇到问题。

AuthSession 在我的设备中打开浏览器,我可以登录,但之后,当我对询问我是否要允许我收到的访问权限的通知回答“是”时,我会在 React Native 应用程序中关闭。

我注意到,如果我在浏览器中注册我的谷歌帐户之前,问题就会消失并且我能够登录。

我使用的代码是这样的:

import * as AuthSession from "expo-auth-session";
import jwtDecode from "jwt-decode";
import * as React from "react";
import { Alert, Button, Platform, StyleSheet, Text, View } from "react-native";

// You need to swap out the Auth0 client id and domain with the one from your Auth0 client.
// In your Auth0 client, you need to also add a url to your authorized redirect urls.
//
// For this application, I added https://auth.expo.io/@arielweinberger/with-auth0 because I am
// signed in as the "arielweinberger" account on Expo and the name/slug for this app is "with-auth0".
//
// You can open this app in the Expo client and check your logs to find out your redirect URL.

const auth0ClientId = "ppSP6KhARumIUKQl5J02GTABifmBdDGy";
const auth0Domain = "expo-auth0.us.auth0.com"
const authorizationEndpoint = `https://${auth0Domain}/authorize`;

const useProxy = Platform.select({ default: false });
const redirectUri = AuthSession.makeRedirectUri({ useProxy, native:"myapp://" });

export default function App() {
  const [name, setName] = React.useState(null);

  const [request, result, promptAsync] = AuthSession.useAuthRequest(
    {
      redirectUri,
      clientId: auth0ClientId,
      // id_token will return a JWT token
      responseType: "id_token",
      // retrieve the user's profile
      scopes: ["openid", "profile"],
      extraParams: {
        // ideally, this will be a random value
        nonce: "nonce",
      },
    },
    { authorizationEndpoint }
  );

  // Retrieve the redirect URL, add this to the callback URL list
  // of your Auth0 application.
  console.log(`Redirect URL: ${redirectUri}`);

  React.useEffect(() => {
    if (result) {
      if (result.error) {
        Alert.alert(
          "Authentication error",
          result.params.error_description || "something went wrong"
        );
        return;
      }
      if (result.type === "success") {
        // Retrieve the JWT token and decode it
        const jwtToken = result.params.id_token;
        const decoded = jwtDecode(jwtToken);

        const { name } = decoded;
        setName(name);
      }
    }
  }, [result]);

  return (
    <View style={styles.container}>
      {name ? (
        <Text style={styles.title}>You are logged in, {name}!</Text>
      ) : (
        <Button
          disabled={!request}
          title="Log in with Auth0"
          onPress={() => promptAsync({ useProxy })}
        />
      )}
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#fff",
    alignItems: "center",
    justifyContent: "center",
  },
  title: {
    fontSize: 20,
    textAlign: "center",
    marginTop: 40,
  },
});
react-native oauth expo
2个回答
9
投票

我解决了。当我调用promptAsync时,我可以添加一些选项,其中之一是showInRecents(浏览的网站是否应该在Android多任务处理程序中显示为单独的条目),默认值为false。将其设置为 true 解决了我的问题。

promptAsync(discovery, { useProxy, showInRecents:true });

0
投票

我在promptAsync中应用了{showInRecents: true},但是浏览器即使重定向到APP也不再关闭,登录页面的浏览器仍然在后台,您有什么解决办法吗?

© www.soinside.com 2019 - 2024. All rights reserved.