react-native - 无法使用 React Native 和 Axios 发送请求
问题描述
我已经阅读了几十个答案,但我似乎无法弄清楚:
- 该请求在 iOS 中运行良好,但在 Android中无法运行
- 我正在使用 React Native 0.57.5 和 axios 0.18.0
- 我把一些日志记录通过
axios.interceptors.request.use(request => { console.log('Starting Request', request) return request }) axios.interceptors.response.use(response => { console.log('Response:', response) return response })
可以看出,请求似乎很好。它不是针对localhost
而是针对实际运行的服务器(我编辑了一些内部标题键和完整的 URL)
- 还要
catch
在我提出 axios 请求的位置添加一个日志语句:
axios.request(config) .then((axiosResponse) => { console.log('GOOD RESPONSE ', axiosResponse) // some logic }) .catch((error) => { console.log('axiosResponse ERROR', error) // some other logic })
这就是我在 chrome 调试器控制台中看到的内容:
axiosResponse ERROR Error: Network Error at createError (createError.js:16) at XMLHttpRequest.handleError (xhr.js:87) at XMLHttpRequest.dispatchEvent (event-target.js:172) at XMLHttpRequest.setReadyState (XMLHttpRequest.js:580) at XMLHttpRequest.__didCompleteResponse (XMLHttpRequest.js:394) at XMLHttpRequest.js:507 at RCTDeviceEventEmitter.emit (EventEmitter.js:190) at MessageQueue.__callFunction (MessageQueue.js:349) at MessageQueue.js:106 at MessageQueue.__guard (MessageQueue.js:297) at MessageQueue.callFunctionReturnFlushedQueue (MessageQueue.js:105) at debuggerWorker.js:72
这是我从 React Native 0.55.0 升级到 0.57.5 的一部分,所以这个 axios 的东西以前可以正常工作。
有任何想法吗?
解决方案
对于你所说的,我认为一定是你没有要求互联网权限,如果是这种情况,你需要在你的 android 项目中编辑你的清单文件,它必须在 $your_project_root_directory/android/app/src/main /AndroidManifest.xml
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="your.package"
android:versionCode="1"
android:versionName="1.0">
...
<uses-permission android:name="android.permission.INTERNET" />
...
</manifest>
另一件事可能是,如果您使用的是 http 连接。尝试以下
<network-security-config>
<domain-config cleartextTrafficPermitted="true">
<domain includeSubdomains="true">yourinsecureserver.com</domain>
</domain-config>
</network-security-config>
<?xml version="1.0" encoding="utf-8"?>
<manifest ... >
<application android:networkSecurityConfig="@xml/network_security_config"
... >
...
</application>
</manifest>
https://android-developers.googleblog.com/2018/04/protecting-users-with-tls-by-default-in.html
推荐阅读
- apache-camel - Camel Exchange getbody 的文件对象为空
- javascript - 将对象值作为单独的项目推送到数组中
- javascript - vueJS 数据属性反应性问题
- python - '_sre.SRE_Match' 对象不可下标
- abap - 当漂亮的打印机不够用时,ABAP 代码应该如何格式化?
- php - Yii2 中的 Web 安全认证问题
- android - 在 AppCompat 中找不到资源
- javascript - Firebase 云功能发送通知
- python - 收到的套接字数据中缺少数据(modbus)
- pdf-generation - 用于 PDF 渲染的 Puppeteer 自定义页眉页脚