React Native Expo应用如何通过IP而非localhost提供服务？

嘿，我之前也踩过这个坑！CRNA默认把服务绑在localhost上，确实会导致手机和模拟器没法正常访问。试试下面这些方法，应该能帮你把服务切换到你的局域网IP上：

• 直接在启动命令中指定IP
  这是最快速的临时解决方案，启动应用时直接带上环境变量：

  # npm 用户
  REACT_NATIVE_PACKAGER_HOSTNAME=你的局域网IP npm start
  # yarn 用户
  REACT_NATIVE_PACKAGER_HOSTNAME=你的局域网IP yarn start
  

  把你的局域网IP换成你电脑实际的IP（比如192.168.1.105），手机和电脑在同一局域网就能访问exp://你的IP:19000了。如果不想每次都敲这么长的命令，直接修改package.json里的scripts：

  "scripts": {
    "start": "REACT_NATIVE_PACKAGER_HOSTNAME=192.168.1.105 react-native start",
    // 其他脚本...
  }
  

  之后只要运行npm start就会自动用指定的IP启动服务。

• 正确设置环境变量
  你之前设置环境变量没生效，大概率是设置方式不对：

  • Mac/Linux：在终端先执行export REACT_NATIVE_PACKAGER_HOSTNAME=你的局域网IP，然后再启动npm start；如果想永久生效，把这条命令加到~/.bashrc或~/.zshrc（根据你用的shell）里，保存后重启终端。
  • Windows：打开命令提示符，执行set REACT_NATIVE_PACKAGER_HOSTNAME=你的局域网IP，再启动npm start；或者在「系统属性-高级-环境变量」里添加这个系统变量，重启终端后再试。
    注意：设置完环境变量一定要关闭所有终端窗口重新打开，确保变量生效。

• 使用--host参数强制指定
  部分版本的CRNA支持直接通过启动参数指定主机：

  npm start -- --host 你的局域网IP
  # 或者 yarn
  yarn start -- --host 你的局域网IP
  

  这个方法有时候比环境变量更直接，适合临时测试。

• 检查网络和防火墙
  别忘了确认：

  • 电脑和手机/模拟器在同一局域网内；
  • 电脑防火墙没有阻止19000、19001端口（CRNA会用到这两个端口）；
  • 如果是Android模拟器，除了用IP，也可以执行adb reverse tcp:19000 tcp:19000，这样模拟器就能通过exp://localhost:19000访问，但手机还是需要用主机IP。

一般来说，前两种方法就能解决问题，优先试试修改package.json的脚本，一劳永逸~

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