首页 > 解决方案 > 错误:WebBrowser 已经打开,一次只能打开一个

问题描述

我正在尝试在 React Native/RNW 应用程序中使用 Expo Auth Session。它在 iOS 和 Web 上运行良好,但是当尝试在 Android 上使用它时,我在我的 adb 日志中收到以下错误消息:

05-15 07:47:57.370 18423 18556 E ReactNativeJS: 'Unhandled promise rejection', { [Error: WebBrowser is already open, only one can be open at a time]
05-15 07:47:57.370 18423 18556 E ReactNativeJS:   line: 231503,
05-15 07:47:57.370 18423 18556 E ReactNativeJS:   column: 28,
05-15 07:47:57.370 18423 18556 E ReactNativeJS:   sourceURL: 'http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false' }

当我单击此组件(以及非常相似的基于 Facebook 的组件)时,会发生错误:

const GoogleAuthBtn = (props) => {
  let [request, response, onButtonPress] = Google.useAuthRequest(googleAuth);

  useEffect(() => {
    if (response && typeof props.onAuthenticate === "function") {
      props.onAuthenticate(response, "Google");
    }
  }, [response]);

  return (
    <AuthButton
      styles={[MainStyles.loginButton]}
      icon={<SocialIcon light raised={false} type="google" />}
      onPress={onButtonPress}
      buttonText={"Sign In with Google"}
    />
  );
};

我认为它一定与这个调用有关:Google.useAuthRequest(googleAuth)因为我试图将代码放入 useEffect 函数中,但它没有触发。

我的 googleAuth 变量看起来像这样(键显然已编辑):

export const googleAuth = {
  responseType: Platform.OS === "web" ? ResponseType.Token : ResponseType.Code,
  webClientId: "<redacted>",
  expoClientId: "<redacted>",
  iosClientId: "<redacted>",
  androidClientId: "<redacted>",
  iosStandaloneAppClientId: "<redacted>",
  androidStandaloneAppClientId: "<redacted>",
  androidsecret: "<redacted>",
};

我没有看到可能导致多个 Expo Browser 窗口同时打开的原因。

它可能是一个冲突的图书馆吗?这不在任何类型的 webview 或任何东西中,而且我在应用程序中使用 webviews 只有几个非常稀疏的区域。

这是在 Expo Bare Workflow React Native 应用程序中

标签: javascriptandroidreact-nativeoauthexpo

解决方案


这实际上是由于我的电话

是这样的:

const AuthButton = (props) => {
  return (
    <TouchableOpacity self={this} onPress={props.onPress}>
      <HoverButton style={LoginButtonStyles}>
        {props.icon}
        <Text style={MainStyles.loginText}>{props.buttonText}</Text>
        <View></View>
      </HoverButton>
    </TouchableOpacity>
  );
};

但是这一行:

<TouchableOpacity self={this} onPress={props.onPress}>

应该是这样的:

<TouchableOpacity self={this} onPress={() => props.onPress()}>

推荐阅读