api - 如何使用 Expo 连接到您的 React Native 中的 API?
问题描述
api
Api 是由 laravel 在我的本地环境中制作的。
ApiController
public function test(Request $request)
{
$test = Test::all();
return response()->json($test, 200);
}
当我得到http://127.0.0.1:8000/api/test时,它可以工作。
用 Expo 反应原生
当我这样做时expo start
,这个项目已经在 http://localhost:19002/
应用程序.js
componentDidMount() {
axios
.get('http://127.0.0.1:8000/api/test')
.then((response) => {
console.log(response);
})
.catch((error) => {
console.error(error);
});
}
我收到一个错误:(
Network Error
- node_modules/axios/lib/core/createError.js:15:17 in createError
- node_modules/axios/lib/adapters/xhr.js:80:22 in handleError
- node_modules/event-target-shim/dist/event-target-shim.js:818:20 in EventTarget.prototype.dispatchEvent
- node_modules/react-native/Libraries/Network/XMLHttpRequest.js:575:10 in setReadyState
- node_modules/react-native/Libraries/Network/XMLHttpRequest.js:389:6 in __didCompleteResponse
- node_modules/react-native/Libraries/vendor/emitter/EventEmitter.js:189:10 in emit
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:425:19 in __callFunction
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:112:6 in __guard$argument_0
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:373:10 in __guard
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:111:4 in callFunctionReturnFlushedQueue
* [native code]:null in callFunctionReturnFlushedQueue
我在 iPhone 上的 Expo Client App 上检查了这个项目。
如果您能给我任何建议,我将不胜感激:)
解决方案
世博会文档说:
默认情况下,iOS 将阻止任何未使用 SSL 加密的请求。如果您需要从明文 URL(以 http 开头的 URL)获取,您首先需要添加应用程序传输安全异常。如果您提前知道需要访问哪些域,则只为这些域添加例外会更安全;如果直到运行时域才知道,您可以完全禁用 ATS。但请注意,从 2017 年 1 月起,Apple 的 App Store 审核将需要合理的理由来禁用 ATS。有关详细信息,请参阅 Apple 的文档。
https://docs.expo.io/versions/v37.0.0/react-native/network/#using-fetch
推荐阅读
- jquery - 如何使用 Jquery 和 Sweet 警报恢复操作?
- android - 我们应该为 Rxjava3 使用哪个 rxjava3 改造适配器
- python-3.x - apscheduler 3.6.1 后台调度程序神秘停止,没有事件或错误
- powershell - Azure DevOps - 从 PS 脚本中调用 PS 脚本
- c++ - 初始化没有复制构造函数的成员聚合类型
- javascript - 如何在 Node.js 中使用 Cheerio 抓取具有变化数据的表?
- reactjs - 使用 useLocation 传递 className 值
- javascript - React TS - textarea 的最大字符数限制
- javascript - 将html表格导出为excel格式?
- java - 无法在 Wordcount Hadoop 中使用单词添加分隔符和文件名