Android应用如何播放HTTP不安全音频流？（Ionic Angular+Capacitor）

问题核心 #

你碰到的是混合内容拦截：Capacitor在Android端默认以HTTPS的localhost加载应用，而HTTP协议的音频流属于不安全内容，被浏览器安全策略直接阻止。

解决方案步骤 #

1. 配置Android网络安全策略 #

在Android项目的app/src/main/res/xml目录下（没有该目录就新建）创建network_security_config.xml文件，写入以下内容：

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <!-- 仅允许指定HTTP流域名的明文流量（推荐） -->
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">stream.xxx.xx</domain>
    </domain-config>
    <!-- 保留localhost的HTTPS安全配置 -->
    <base-config cleartextTrafficPermitted="false">
        <trust-anchors>
            <certificates src="system" />
        </trust-anchors>
    </base-config>
</network-security-config>

如果只是测试需要允许所有HTTP域名（不推荐生产环境用），可以简化为：

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <base-config cleartextTrafficPermitted="true">
        <trust-anchors>
            <certificates src="system" />
        </trust-anchors>
    </base-config>
</network-security-config>

2. 在AndroidManifest.xml中关联配置 #

打开app/src/main/AndroidManifest.xml，在<application>标签里添加android:networkSecurityConfig属性：

<application
    ...
    android:networkSecurityConfig="@xml/network_security_config"
    ...>

3. 配置WebView允许混合内容 #

如果上述设置后仍无法播放，需要调整Capacitor的WebView设置：

Java版本（MainActivity.java）：

import com.getcapacitor.Bridge;
import android.webkit.WebSettings;

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    this.init(savedInstanceState, new ArrayList<Class<? extends Plugin>>() {{
        // 这里添加你的插件类
    }});
    
    WebSettings settings = getBridge().getWebView().getSettings();
    // 允许HTTPS页面加载HTTP资源
    settings.setMixedContentMode(WebSettings.MIXED_CONTENT_COMPATIBILITY_MODE);
}

Kotlin版本（MainActivity.kt）：

import com.getcapacitor.Bridge
import android.webkit.WebSettings

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    init(savedInstanceState, listOf())
    
    val settings = bridge.webView.settings
    settings.mixedContentMode = WebSettings.MIXED_CONTENT_COMPATIBILITY_MODE
}

4. 重新构建测试 #

执行命令重新同步并运行Android项目：

ionic capacitor sync android
ionic capacitor run android

注意事项 #

• 优先使用指定域名的网络安全配置，全局允许明文流量会增加应用安全风险。
• MIXED_CONTENT_COMPATIBILITY_MODE是Android WebView处理混合内容的标准兼容模式，能确保HTTP资源正常加载。

内容的提问来源于stack exchange，提问作者NorthFred