React-native JS 调试器与 CORS 相关的问题 — iOS

Question

我在 iOS 上使用 React-native JS 调试器时遇到问题。当我尝试使用 JS 调试器工具调试我的应用程序时，会发生错误。我在网络上尝试了不同的解决方案，但没有成功。有没有人遇到过这个错误并设法修复它？

复制:

1) 在真实的 iOS 设备上运行开发应用程序，该应用程序从 http://172.16.23.27.xip.io:8081/index.delta?platform=ios&dev=true&minify=false 加载 JS 包。

2)启用JS远程调试工具，打开http://localhost:8081/debugger-ui/在 Chrome 中。

3) bundle 重新加载，Chrome DevTools 控制台显示以下错误:

加载失败http://172.16.23.27.xip.io:8081/index.delta?platform=ios&dev=true&minify=false :请求的资源上不存在“Access-Control-Allow-Origin” header 。来源'http://localhost:8081 ' 因此不允许访问。如果不透明响应满足您的需求，请将请求模式设置为“no-cors”以在禁用 CORS 的情况下获取资源。(索引):188 未捕获( promise )类型错误:无法获取

"react": "16.2.0",
"react-native": "0.52.1"

Answer 1

尝试使用http://172.16.23.27.xip.io:8081/debugger-ui/进行调试。

或

1. 打开/node_modules/metro/src/Server\index.js

2. 查找_processDeltaRequest

     mres.setHeader(FILES_CHANGED_COUNT_HEADER, String(output.numModifiedFiles));
     mres.setHeader('Content-Type', 'application/javascript');
     mres.setHeader('Content-Length', String(Buffer.byteLength(output.bundle)));
   + mres.setHeader('Access-Control-Allow-Origin', '*');
     mres.end(output.bundle);