React Native Android：未激活远程调试器时Fetch请求异常

我之前在React Native开发中也碰到过几乎一模一样的诡异问题——不开远程调试就软锁，开了就一切正常，日志还没报错。结合你的描述，这大概率是JavaScript引擎差异或者静默的序列化/网络问题导致的，毕竟远程调试时用的是Chrome的V8引擎，离线时Android默认跑的是Hermes（旧版是JSC），两者在细节处理上有不少差异。下面是我亲测有效的排查和解决步骤：

1. 先抓出静默的JSON解析错误 #

虽然你说日志显示请求成功，但很可能API返回的JSON里藏着Hermes/JSC不兼容的格式（比如BigInt、undefined值、或者不符合JSON规范的 trailing commas）。Fetch的response.json()在非调试模式下遇到这些问题会静默失败，不会抛错，但Redux的action因为数据异常无法正确触发reducer更新，最终导致软锁。

解决方法是手动处理响应文本，加上try/catch捕获解析错误：

fetch('你的API地址')
  .then(response => {
    // 先确认响应状态码
    if (!response.ok) {
      throw new Error(`HTTP错误: ${response.status}`);
    }
    return response.text(); // 先拿原始文本，不要直接用json()
  })
  .then(rawText => {
    try {
      const data = JSON.parse(rawText);
      console.log('解析后的数据:', data); // 这里能看到真实的数据结构
      dispatch(yourSuccessActionCreator(data));
    } catch (parseErr) {
      console.error('JSON解析失败:', parseErr);
      console.error('原始响应文本:', rawText); // 关键！看返回的到底是什么
      dispatch(yourFailureActionCreator(parseErr));
    }
  })
  .catch(fetchErr => {
    console.error('Fetch请求异常:', fetchErr);
    dispatch(yourFailureActionCreator(fetchErr));
  });

这样你就能在Logcat里看到调试时看不到的解析错误，我当时就是因为API返回了一个BigInt类型的ID，Hermes解析时直接挂了但没报错。

2. 检查Redux异步中间件的执行逻辑 #

如果你用的是redux-thunk或者redux-saga，离线模式下中间件的异步调度可能因为引擎的微任务队列差异，导致action没有正确分发：

• Redux-Thunk：确保你的thunk函数正确返回Promise，并且在dispatch前确认数据是有效的。比如在thunk里加日志，打印dispatch前后的状态，看reducer是否真的接收到了action：

  export const fetchData = () => async dispatch => {
    dispatch(fetchStart());
    try {
      // 上面的Fetch逻辑
      const data = await fetchAndParseData();
      console.log('准备dispatch成功action:', data);
      dispatch(fetchSuccess(data));
      console.log('dispatch后的状态:', store.getState().yourReducer); // 检查状态是否更新
    } catch (err) {
      dispatch(fetchFailure(err));
    }
  };
  

• Redux-Saga：检查是否有依赖调试环境的定时器（比如delay）或者异步逻辑，Hermes和V8的定时器精度不同，可能导致saga没有正确监听action。可以尝试把sagaMiddleware.run()的逻辑放在App启动的最开始，确保中间件完全初始化后再发起请求。

3. 验证Hermes引擎的兼容性 #

新版React Native默认启用Hermes，它和JSC在某些API支持上有区别，比如fetch的某些参数处理。可以临时禁用Hermes来排查：

1. 打开android/app/build.gradle，修改配置：

   project.ext.react = [
     enableHermes: false  // 从true改成false
   ]
   

2. 清理缓存并重新构建：

   cd android && ./gradlew clean && cd .. && npx react-native run-android
   

如果禁用后问题消失，那就是Hermes和你的代码/依赖的兼容性问题，可以尝试升级React Native版本，或者去官方issues里搜相关的Hermes Fetch问题。

4. 检查Android网络配置 #

Android 9及以上默认禁止明文HTTP请求，如果你的API是HTTP协议，调试时Chrome可能绕过了这个限制，但离线时会静默失败：

• 打开android/app/src/main/AndroidManifest.xml，在application标签里添加：

  <application
    ...
    android:usesCleartextTraffic="true">
    ...
  </application>
  

另外，也可以用Android Studio的Network Inspector抓包，看实际的请求是否真的发送出去，以及响应是否正确。

按照这个顺序排查，基本能定位到问题——我当时就是JSON解析的问题，抓出后把API返回的BigInt转成字符串就解决了。

内容的提问来源于stack exchange，提问作者Mike Huebner