React Native 0.70使用Hermes打开调试器报错：缺少HTTP/HTTPS协议

核心解决步骤 #

• 补全调试器URL协议头
  通过摇一摇设备或按下Ctrl+M/Cmd+M呼出开发者菜单，检查"Debug JS Remotely"对应的地址，必须确保URL带有http://或https://前缀，比如使用http://localhost:8081而非localhost:8081。

• 重置Metro缓存
  关闭当前运行的Metro服务器，在项目根目录执行以下命令清除缓存：

  npx react-native start --reset-cache
  

  重启项目后再次尝试打开调试器。

• 修正Metro配置文件
  打开项目根目录的metro.config.js，检查是否存在自定义调试地址配置。确保debuggerHost字段包含完整协议头，示例配置如下：

  module.exports = {
    // 其他配置项
    server: {
      debuggerHost: 'http://localhost:8081',
    },
  };
  

• 排查环境变量干扰
  检查系统中是否存在REACT_NATIVE_DEBUG_HOST这类环境变量，若有则确认其值带有正确的HTTP/HTTPS协议头。

• 重置开发者菜单配置
  在开发者菜单中选择"Reset All Settings"，清除旧的错误配置后重新设置调试器地址。

真机调试特殊处理 #

如果使用真机调试，需确保手机与电脑在同一局域网内，调试URL使用电脑的局域网IP并带协议头，比如http://192.168.1.100:8081，而非localhost。

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