React Native+Expo如何后台打开URL，不跳转至浏览器页面

完全可以实现，你要的“后台打开URL”本质是向目标地址发起HTTP网络请求，而非打开网页页面。以下是具体实现方案：

核心实现：直接用原生fetch API #

Expo完全支持浏览器标准的fetch API，点击按钮时直接发起请求即可，不会跳转浏览器，请求在App后台执行。

基础GET请求示例 #

import { Button } from 'react-native';

const handleBackgroundUrlRequest = async () => {
  try {
    // 发起GET请求到目标URL
    const response = await fetch('https://your-target-url.com');
    
    // 根据响应状态判断结果
    if (response.ok) {
      console.log('URL请求成功完成');
      // 可选：解析响应内容
      // const responseData = await response.text();
      // console.log('响应内容:', responseData);
    } else {
      console.log('URL请求失败，状态码:', response.status);
    }
  } catch (error) {
    console.error('请求过程出错:', error);
  }
};

// 在按钮中调用
<Button title="后台请求URL" onPress={handleBackgroundUrlRequest} />

带参数的POST请求示例 #

如果需要向URL提交数据，可配置请求方法和参数：

const handlePostRequest = async () => {
  try {
    const response = await fetch('https://your-target-url.com', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      // 传递JSON格式的请求体
      body: JSON.stringify({
        userId: 123,
        action: 'trigger'
      }),
    });
    
    const responseData = await response.json();
    console.log('请求响应:', responseData);
  } catch (error) {
    console.error('POST请求出错:', error);
  }
};

为什么你之前的方法不适用？ #

• react-native-linking/window.open：这类工具的作用是打开外部链接页面，会触发浏览器跳转，并非后台请求
• background-fetch：用于定时在App后台执行周期性任务，不是点击触发的即时请求

注意事项 #

1. 如果目标URL是HTTP协议（非HTTPS），需要在Expo的app.json中配置允许不安全的HTTP请求：

{
  "expo": {
    "ios": {
      "infoPlist": {
        "NSAppTransportSecurity": {
          "NSAllowsArbitraryLoads": true
        }
      }
    },
    "android": {
      "usesCleartextTraffic": true
    }
  }
}

2. 如果需要App退到后台后仍能完成请求，可结合expo-task-manager和expo-background-fetch实现，但仅点击按钮触发的场景用fetch足够。

内容的提问来源于stack exchange，提问作者Rüveyda