离子 4 Http 故障响应 (未知网址): 0 未知错误.在真实设备上调用 API 时

Question

我有一个调用.NET Core后端API的ionic 4应用程序。它在 chrome 浏览器上正常工作，但是当我在安卓设备上运行 apk 时，响应是：

{"headers":{"normalizedNames":{},"lazyUpdate":null,"headers":{}},"status":0,"statusText":"Unknown Error","url":null,"ok":false,"name":"HttpErrorResponse","message":"Http failure response for (unknown url): 0 Unknown Error","error":{"isTrusted":true}}

关于标题，我附加了这些选项：

const httpOptions = {
    headers: new HttpHeaders({
        "Content-Type": "application/x-www-form-urlencoded; charset=utf-8" , 
        "Access-Control-Allow-Origin": "*", 
        "Access-Control-Allow-Headers": "Origin, Content-Type, X-Auth-Token, Accept, Authorization, X-Request-With",
        "Access-Control-Allow-Credentials" : "true",
        "Access-Control-Allow-Methods" : "GET, POST, DELETE, PUT, OPTIONS, TRACE, PATCH, CONNECT"  
       }) 
};  

我已经安装了插件：cordova-plugin-ionic-webview

以及从"@angular/common/http"使用HttpClient

我的API远程托管，没有使用SSL证书！

我

用谷歌搜索了所有解决方案，但没有一个能解决我的问题

Answer 1

我遇到了同样的问题，以下是我的条件：

• 我的 Ionic 4 应用程序在 Chrome 上运行良好，但是当我在模拟器上运行它时，它给了我"未知错误">问题。
• 我的后端是Laravel 6。
• 我在使用Android Studio和Visual Studio代码的Mac上。
• 我试图在服务器上调用 API。

我尝试了很多方法来解决问题。我确信这不是 COR 的问题，因为我已经处理好了它。

那么如何解决这样的事情。您只需添加一行，即

android:usesCleartextTraffic="true"

在此标记中：

<application android:usesCleartextTraffic="true">
</application>

在您的清单文件中，即

[yourProject]/android/app/src/main/AndroidManifest.xml

你很好去。

Answer 2

我建议您检查某些事项：

1( 在您的服务器端启用 CORS

2( 如果您的 API 不是 https，请确保 android webview 没有阻止流量。强制启用 cleartextTraffic ，默认情况下处于禁用状态。在应用中添加安全配置，如下所示。此处的设置参考

<edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application" xmlns:android="http://schemas.android.com/apk/res/android">
            <application android:usesCleartextTraffic="true" />
</edit-config>

Answer 3

经过两天的努力，我终于可以解决问题了！我将 API 调用从"@angular/common/http"迁移到本机 http "@ionic-native/http/ngx"使用此标头：

        // create headers data
        const headers = {
          "Content-Type": "application/x-www-form-urlencoded; charset=utf-8", 
          'Accept': 'application/json, text/plain',
          "cache-control": "no-cache", 
          "Access-Control-Allow-Origin": "*", 
          "Access-Control-Allow-Headers": "Origin, Content-Type, X-Auth-Token, Accept, Authorization, X-Request-With, Access-Control-Request-Method, Access-Control-Request-Headers",
          "Access-Control-Allow-Credentials" : "true",
          "Access-Control-Allow-Methods" : "GET, POST, DELETE, PUT, OPTIONS, TRACE, PATCH, CONNECT",  
          };

对我来说的缺点，现在我必须在真实设备上进行测试。

Answer 4

4 Possible Case 
1: Check your Internet connection 
2: Cors must be enabled from Backend
3:   android:usesCleartextTraffic="true" must be added in config.xml and android manifest file in the resource folder
4: Backend IP or domain should be configured in /resources/android/xml/network_security_config.xml


 

Answer 5

我遇到了这个问题，我在 API 中添加了 cors 条件并更改了 WebViewer 版本，但错误仍然存在。您可以通过修改运行我的 api 的服务器的 ip 来解决它。

/

resources/android/xml/network_security_config.xml

Answer 6

localhost 不支持任何 android 应用程序。如果您尝试使用本地主机访问API，那么android会考虑本地主机0.0.0.0：

Answer 7

我遇到了同样的问题，以下是我的条件：

我的 Ionic 6 和电容器应用程序在 Chrome 上运行良好，但是当我在模拟器上运行它时，它给了我"未知错误"问题。

我的后端是AWS。

我在使用Android Studio和Visual Studio代码的Mac上。我试图在服务器上调用 API。我尝试了很多方法来解决问题。我确信这不是 CORS 问题，因为我已经处理好了它。

那么如何解决这样的事情。您只需添加一行，即

android:usesCleartextTraffic="true"

在此标记中：

<application android:usesCleartextTraffic="true">
</application>

在此处输入图像描述在您的清单文件中，即

[yourProject]/android/app/src/main/AndroidManifest.xml

如果您使用 ionic 和 cordova 更好地在侧配置中添加 usecleartraffic.xml如果您使用的是 cordova，下面是从工作应用程序中获取的示例。

<platform name="android">
        <preference name="android-targetSdkVersion" value="32" />
        <edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
            <application android:usesCleartextTraffic="true" />
        </edit-config>

你很好去。

Answer 8

下面的变化终于对我有用了将 API 端点从 http://localhost:7071/data 更改为 http://192.168.1.11:7071/data，其中 192.168.1.11 是主机的本地 IP 地址。