IONIC 5.2.2:无法加载资源:net::ERR_CLEARTEXT_NOT_PERMITTED。标准溶液不起作用

Mic*_*eyn 1 javascript ionic-framework angular

网络安全配置.xml

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config>
        <domain includeSubdomains="true">localhost</domain>
        <domain includeSubdomains="true">192.168.1.3</domain>
    </domain-config>
</network-security-config>
Run Code Online (Sandbox Code Playgroud)

配置文件

<platform name="android">
        <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" />
            <application android:networkSecurityConfig="@xml/network_security_config" />
        </edit-config>
        <resource-file src="resources/android/xml/network_security_config.xml" target="app/src/main/res/xml/network_security_config.xml" />
        <resource-file src="google-services.json" target="app/google-services.json" />
        <allow-intent href="market:*" />
        <icon density="ldpi" src="resources\android\icon\drawable-ldpi-icon.png" />
        <icon density="mdpi" src="resources\android\icon\drawable-mdpi-icon.png" />
        <icon density="hdpi" src="resources\android\icon\drawable-hdpi-icon.png" />
        <icon density="xhdpi" src="resources\android\icon\drawable-xhdpi-icon.png" />
        <icon density="xxhdpi" src="resources\android\icon\drawable-xxhdpi-icon.png" />
        <icon density="xxxhdpi" src="resources\android\icon\drawable-xxxhdpi-icon.png" />
        <splash density="land-ldpi" src="resources\android\splash\drawable-land-ldpi-screen.png" />
        <splash density="land-mdpi" src="resources\android\splash\drawable-land-mdpi-screen.png" />
        <splash density="land-hdpi" src="resources\android\splash\drawable-land-hdpi-screen.png" />
        <splash density="land-xhdpi" src="resources\android\splash\drawable-land-xhdpi-screen.png" />
        <splash density="land-xxhdpi" src="resources\android\splash\drawable-land-xxhdpi-screen.png" />
        <splash density="land-xxxhdpi" src="resources\android\splash\drawable-land-xxxhdpi-screen.png" />
        <splash density="port-ldpi" src="resources\android\splash\drawable-port-ldpi-screen.png" />
        <splash density="port-mdpi" src="resources\android\splash\drawable-port-mdpi-screen.png" />
        <splash density="port-hdpi" src="resources\android\splash\drawable-port-hdpi-screen.png" />
        <splash density="port-xhdpi" src="resources\android\splash\drawable-port-xhdpi-screen.png" />
        <splash density="port-xxhdpi" src="resources\android\splash\drawable-port-xxhdpi-screen.png" />
        <splash density="port-xxxhdpi" src="resources\android\splash\drawable-port-xxxhdpi-screen.png" />
    </platform>
Run Code Online (Sandbox Code Playgroud)

验证码

import { HttpClient, HttpHeaders } from '@angular/common/http';
...
async login(email:string, password:string) {
    let loginObject = {email, password};
    let httpOptions = {
      headers: new HttpHeaders({
        'Content-Type':  'application/json'
      })
    };
    let res:any = await this.http.post("http://192.168.1.3:3001/login", loginObject, httpOptions).toPromise()
    console.log("res,",res);
    if (res.msg == 'auth-success') {
      console.log("res token:", res.token);
      await this.storage.setItem(TOKEN_KEY, res.token);
      this.authenticationState.next(true);
      return 'auth-success';
    }
    else
    {
      this.authenticationState.next(false);
      return 'login-failed';
    }
  }
Run Code Online (Sandbox Code Playgroud)

错误图像

我在网上尝试了多种“奇怪”的解决方案,但没有一个有效。我不明白为什么当我启用明文时,我仍然不允许通过我的内部 IP 进行调试。

此外,值得一提的是,我之前的离子项目“随机”因无效的 .json 而中断。我没有正确提交我的更改并最终陷入困境,因此我开始了一个全新的项目并一直在构建我以前的配置。此外,我已经验证服务器正在我的路由器上运行。以前,发布的代码解决了我的问题。但现在,情况并非如此。拔我的头发!

提前致谢。

编辑: network_security_config.xml

<?xml version="1.0" encoding="utf-8"?>
<network-security-config cleartextTrafficPermitted="true">
    <base-config cleartextTrafficPermitted="true">
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">localhost</domain>
        <domain includeSubdomains="true">192.168.1.3</domain>
    </domain-config>
</network-security-config>
Run Code Online (Sandbox Code Playgroud)

问题仍然没有解决。

Pan*_*ati 5

使用:

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <base-config cleartextTrafficPermitted="true">

    </base-config>
</network-security-config>
Run Code Online (Sandbox Code Playgroud)

或者

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">localhost</domain>
        <domain includeSubdomains="true">192.168.1.3</domain>
    </domain-config>
</network-security-config>
Run Code Online (Sandbox Code Playgroud)

为什么?

在 Android 9+ 中,cleartextTrafficPermission="true" 默认为 false

<domain>标签特定于特定域(在您的情况下为“localhost”或“192.168.1.3”)

<base-config>标签适用于未在中指定的任何域<domain>

其目标未包含在域配置中的所有连接使用的默认配置。

详细说明:

当您请求不使用加密的服务器(即不支持 https)时,会发生明文错误。

从 Android 9(API 级别 28)开始,默认情况下禁用明文支持。

要解决此错误,您需要告诉 android 启用明文支持。这是在 network_security_config.xml 文件中完成的。

阅读更多内容: https: //developer.android.com/training/articles/security-config#domain

编辑:

Android 的新安全策略阻止在非加密连接 (http) 上传输文本。如果您在 Android 版本 8 或更低版本的设备上测试以前的配置,则不会收到此错误。在Android 9+(SDK 28)之后,我们需要明确告诉Android我们正在使用http连接。因此,我们在 network_security_config.xml 文件中指定域。<base-config>标签用于允许所有域上的clearTextTraffic。如果您确定应用程序将使用的域,则可以在<domain>tag 和 use tag 中指定它们。