错误：WebBrowser 已经打开，一次只能打开一个答案

【问题标题】：Error: WebBrowser is already open, only one can be open at a time错误：WebBrowser 已经打开，一次只能打开一个
【发布时间】：2021-08-05 08:18:32
【问题描述】：

我正在尝试在 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 应用程序中

【问题讨论】：

标签： javascript android react-native oauth expo

【解决方案1】：

这实际上是由于我在

原来是这样的：

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()}>

【讨论】：