1. 问题 我们知道,调试rn程序时,使用remote js debugging,通过chrome查看日志,但是有时会出现cors错误,其实就是跨域问题。 cors错误截图 下面是报错的内容 Failed to load http://192.168.38.106.xip.io:8081/index.delta?platform=ios&dev=true&minify=false&deltaBundleId=2: No 'Access-Control-Allow-Origin' ...
http://xip.io/ CORS issue with JS Remote Debugging when using xip.io Debugging on a device with Chrome Developer Tools
首先,使用官方工具react-native-cli创建好一个初始化的工程,并安装好依赖。 安装的命令为“react-native init DebugTest”(DebugTest为我们这次的项目名称) 安装完成后,就会多出一个名为DebugTest项目文件夹,文件夹内结构如下: 图1. 项目初始结构 让我们把项目运行起来。我这里是在Windows下开发Android平台的应用,并...
import{ YellowBox }from'react-native'; YellowBox.ignoreWarnings(['Remote debugger']); 从官方 React Native 文档中参考: https://facebook.github.io/react-native/docs/debugging.html react-nativev0.56或以下: 在您的代码中尽早添加以下内容: console.ignoredYellowBox= ['Remote debugger']; 简单,简单且特...
闲来无事,折腾了一下React Native,相比之前,开发体验好了不少。但在真机断点调试那里遇到了跨域资源加载出错的问题,一番探索总算解决,目测是RN新版本调试服务的bug。 遇到类似问题的同学应该不少,这里做下记录,有需要的可以参考下。 如何断点调试 首先,在真机上加载运行RN应用(过程略)。
刷新功能针对JavaScript文件修改,Native 代码修改不起作用。 Remote JS Debuging 远程调试,未开启的状态是Debug JS Remotely,已开启的状态则显示Stop Remote JS Debugging,默认打开是谷歌浏览器。 Enable Live Reload 自动刷新,应用中的 JavaScript 代码有任何修改,它都会自动帮我们主动触发reload,不需要人为去操作刷新功能...
React Native(以下简称RN)为传统前端开发者打开了一扇新的大门。其中,使用浏览器的调试工具去Debug移动端的代码,无疑是最吸引开发人员的特性之一。 试想一下,当你在手机屏幕按下一个按钮,处理事件的代码就可以立即在浏览器的调试工具里进行断点调试,而且每当你对代码进行修改,界面便可以完成快速地重载,省去昂长的...
在github issue《CORS issue with JS Remote Debugging when using xip.io》里,有开发者反馈了同样的错误。 他是这样解决的: 找到node_modules/metro模块,修改Server/index.js、index.js.flow文件,在_processDeltaRequest方法里加上下面代码。 mres.setHeader("Access-Control-Allow-Origin","*"); ...
项目快捷键m打开菜单,选择Debug Remote JS,react-native-debugger就会自动连接上 查看network调用,可以直接右键选择Enable Network Inspect 也可查阅官方使用方法 https://docs.expo.dev/debugging/tools/#react-native-debugger 注意 目前react-native-debugger v0.13.0目前只支持expo v47之前的版本,expo v48是无法使用...
React Native(以下简称RN)为传统前端开发者打开了一扇新的大门。其中,使用浏览器的调试工具去Debug移动端的代码,无疑是最吸引开发人员的特性之一。 试想一下,当你在手机屏幕按下一个按钮,处理事件的代码就可以立即在浏览器的调试工具里进行断点调试,而且每当你对代码进行修改,界面便可以完成快速地重载,省去昂长的...