RN使用Chrome调试
背景
使用react_native_debugger调试工具经常崩溃,其他调试工具也不是很好用。Chrome适合调试,但存在两个问题:
-
浏览器跨域问题
-
network不展示接口请求response
如图所示:
解决方案
跨域:
-
浏览器的 xx.xx.xx.xx:8081/debugger-ui… 改为localhost模式 http://localhost:8081/debugger-ui/
-
Chrome浏览器下载跨域扩展,比如CORS Unblock,添加扩展后点亮开启使用即可,使用方式参考:add0n.com/access-cont…
如果还是出现Network面板的response数据无法查看:
尝试在App.js(或index.android.js/index.ios.js)文件添加如下代码:
global.XMLHttpRequest = global.originalXMLHttpRequest || global.XMLHttpRequest;
效果
建议
调试过程中如果出现warning Remote debugger is in a background tab which may cause apps to perform slowly.
可尝试在新的窗口打开调试tab,速度快一些。