React Native:真机断点调试+跨域资源加载出错问题解决

在React Native开发中，有时候我们需要在真机上进行断点调试来定位问题。本文将介绍怎样在真机上进行断点调试，并解决跨域资源加载出错的问题。
1. 首先，我们需要将真机连接到开发机器上。确保真机和开发机器在同一个局域网中，并且已安装了React Native的开发环境。
2. 打开终端，进入项目目录，并运行以下命令来启动React Native的开发服务器：
```
react-native start
```
3. 在终端中，会看到一个二维码和一个本地服务器地址。确保开发机和真机处于同一个局域网中，并能够访问该服务器地址。
4. 在真机上打开React Native利用，可以通过以下方法之一：
- 扫描二维码：使用专用的二维码扫描利用程序扫描终端中的二维码。
- 手动输入地址：在真机的浏览器中手动输入开发服务器的地址。
5. 在开发机器上打开Chrome浏览器，并输入以下地址来访问真机上的React Native利用的调试界面：
```
chrome://inspect/#devices
```
6. 在Chrome的调试界面中，你应当能够看到连接到开发机上的真机装备。点击"inspect"按钮来打开真机上的调试工具。
7. 现在，你可以在真机上进行断点调试了。在调试工具中，你可以设置断点、查看变量的值，并逐渐履行代码。
接下来，我们来解决跨域资源加载出错的问题。在React Native中，跨域资源加载出错常常是由于未正确配置网络要求引发的。以下是一些常见的解决方法：
1. 在iOS上，打开项目的Info.plist文件，添加以下内容：
```xml
NSAppTransportSecurity

NSAllowsArbitraryLoads


```
这将允许你的利用程序加载任何来源的资源，包括跨域资源。
2. 在Android上，打开项目的AndroidManifest.xml文件，添加以下内容：
```xml
android:usesCleartextTraffic="true"
...
>
...

```
这将允许你的利用程序使用明文流量加载跨域资源。
3. 如果你的利用程序需要加载HTTPS资源，则需要在Android的网络安全配置文件中添加相应的配置。打开项目的res/xml/network_security_config.xml文件，添加以下内容：
```xml







```
这将允许你的利用程序加载系统证书中的HTTPS资源。
4. 如果你的利用程序需要加载自签名的HTTPS资源，则需要在Android的网络安全配置文件中添加相应的证书配置。打开项目的res/xml/network_security_config.xml文件，添加以下内容：
```xml









```
将你的自签名证书放在项目的res/raw目录下，并将其命名为network_security_config.cer。这将允许你的利用程序加载自签名的HTTPS资源。
通过以上步骤，你应当能够在真机上进行断点调试，并解决跨域资源加载出错的问题。