反应本机 axios 请求在 IOS 模拟器中不起作用

Posted 2023-02-23

【中文标题】反应本机 axios 请求在 IOS 模拟器中不起作用

【英文标题】：react native axios request not working in IOS simulator

【发布时间】：2019-01-15 07:55:43

【问题描述】：

我正在尝试使用 axios 从 API 获取数据。

这是我发出获取请求的代码：

export const loadBloodGroups = () => 
    return (dispatch) => 

        dispatch( type: LOADING_BLOOD );

        const url = `http://www.example.org/api/bloodgroup/getusersbloodgroup`;
        axios.get(url)
        .then(response => loadingSuccess(dispatch, response))
        .catch(error => loadingFail(dispatch, error));
    ;
;

const loadingFail = (dispatch, error) => 
    console.log(error);
    dispatch( 
        type: LOADING_BLOOD_FAIL,
        payload: error
    );
;

const loadingSuccess = (dispatch, response) => 
    dispatch(
        type: LOADING_BLOOD_SUCCESS, 
        payload: response
    );
; 

http 的 info.plist 设置：

在安卓模拟器上可以正常使用，但是IOS模拟器不行。

在我的浏览器调试控制台中显示：

它显示的 Mac 终端：

谁能告诉我，我在哪里做错了？还是我需要为 IOS 做任何其他配置？

我的平台：

操作系统：Mac 10.13 节点：10.7 npm: 6.3.0 反应：16.4.1 反应原生：0.55

【问题讨论】：

尝试使用控制台检查错误，将.catch(error => loadingFail(dispatch, error));更改为.catch(error => console.log(error); loadingFail(dispatch, error) );请粘贴控制台消息的输出。

您可以尝试删除 catch() 部分并在 then() 部分中添加错误处理吗？就像这样 .then(response=> , error=>)。这不会解决您的问题，但它可能会帮助您调试它。看看这条推文，了解我为什么建议这个twitter.com/dan_abramov/status/770914221638942720?lang=en

我测试了你建议的两种方式，但我得到了相同的Network error

@Arif 你找到解决方案了吗？我也有同样的问题。我可以从模拟器的 Safari 访问相同的 http url，但不能从我的应用程序访问。

@Yossi 而不是更改 http 的配置。我做了我的服务https。现在它工作正常。

【参考方案1】：

更新您的 Info.plist ：

<key>NSAppTransportSecurity</key>
    <dict>
        <key>NSAllowsArbitraryLoads</key>
        <true/>
    </dict>

【讨论】：

我已经从here 尝试过。但它也给了我同样的错误。

那么您的网络有问题，请尝试更改它或尝试在设备中运行您的应用。

【参考方案2】：

在尝试更改 ATS 密钥时，您删除了用于 react native 的密钥 NSAppTransportSecurity 的 plist 值

<key>NSAppTransportSecurity</key>
    <dict>
        <key>localhost</key>
            <dict>
                <key>NSExceptionAllowsInsecureHTTPLoads</key>
                <true/>
            </dict>
        <key>bloodconnector.org</key>
            <dict>
                <key>NSExceptionAllowsInsecureHTTPLoads</key>
                <true/>
            </dict>
</dict>

【讨论】：

我在我的问题中添加了localhost 并更新了 info.plist 屏幕截图。但这并没有解决。

@Arif 你还面临这个问题吗？您的终端中的错误通常是由于您的模拟器无法连接到您打包的。有时重新启动打包程序和模拟器会有所帮助。

是的。我仍然面临这个问题。我重新启动模拟器，但无法正常工作。好的，我将通过重新启动包来检查它。

【参考方案3】：

只需编辑 info.plist：删除“NSExceptionMinimumTLSVersion”，然后添加“NSExceptionRequiresForwardSecrecy”和“false”值。

<key>NSAppTransportSecurity</key>
    <dict>
        <key>NSExceptionDomains</key>
            <dict>
                <key>specificDomain.com</key>
                <dict>
                    <key>NSIncludesSubdomains</key>
                    <true/>
                    <key>NSExceptionAllowsInsecureHTTPLoads</key>
                    <true/>
                    <key>NSExceptionRequiresForwardSecrecy</key>
                    <false/>
                </dict>
            </dict>
        <key>NSAllowsLocalNetworking</key>
        <true/>
    </dict>

【参考方案4】：

在寻找React native IOS Network Error的解决方法时，我找到了解决方法： 在 iOS 和 android 的本地主机路径上工作时创建问题 如果您将 localhost 用于 android，请将其作为您的路径：'http://10.0.2.2:3000' 如果您在 iOS 上使用 localhost，请将其作为您的路径：http://localhost:3000

以下是代码：

import Platform from 'react-native'
import axios from 'axios';
var baseURL = null;

Platform.OS === 'android'? baseURL = 'http://10.0.2.2:3000' : baseURL= 'http://localhost:3000'

export const getNotifications = () =>
    axios.get(`$baseURL/notifications`, 
        headers: 
            Accept: 'application/json',
            'Content-Type': 'application/json',
        ,
    );