混合内容：页面通过 HTTPS 加载，但请求不安全的图像

问题描述 投票：0回答：2

自从我在项目中添加 

ReactJS
库以来，我的 
react-native-google-cast
代码遇到了问题。
问题如下：

我想将来自网络的 HTTP 视频源投射到我的 Android TV。我在应用程序中添加了 
CastButton
，它运行良好并可以检测我周围的设备。
但问题是，当我想启动到我的 Android 电视盒（在 Android 9 下）的投射时，它失败并显示以下消息：
"Mixed Content: The page at 'https://www.gstatic.com/cast/sdk/default_receiver/1.0/app.html?skin=https://www.gstatic.com/eureka/player/0000/skins/cast/skin.css&google_cast_bg=true' was loaded over HTTPS, but requested an insecure video 'XXXX'. This content should also be served over HTTPS."
。
经过在网络上的多次研究后，我发现使用本主题的解决方案应该可以解决问题，但错误并没有不断出现。 （Android 8：不允许明文 HTTP 流量）。 我发现文件 
android/app/build/intermediates/instant_app_manifest/debug/AndroidManifest.xml:4
包含 
android:targetSandboxVersion="2"
，但我无法覆盖它，因为每次重建都会从某个地方（？）重新加载它。

这是我的 AndroidManifest.xml 文件：

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
  package="com.iptvapp"
  android:targetSandboxVersion="1"
  android:usesCleartextTraffic="true">

    <uses-permission android:name="android.permission.INTERNET" />

    <application
      android:name=".MainApplication"
      android:label="@string/app_name"
      android:icon="@mipmap/ic_launcher"
      android:roundIcon="@mipmap/ic_launcher_round"
      android:allowBackup="false"
      android:networkSecurityConfig="@xml/network_security_config"
      android:theme="@style/AppTheme">
      <meta-data
        android:name="com.google.android.gms.cast.framework.OPTIONS_PROVIDER_CLASS_NAME"
        android:value="com.reactnative.googlecast.GoogleCastOptionsProvider" />
      <activity
        android:name=".MainActivity"
        android:label="@string/app_name"
        android:configChanges="keyboard|keyboardHidden|orientation|screenSize|uiMode"
        android:launchMode="singleTask"
        android:windowSoftInputMode="adjustResize">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
      </activity>
      <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
    </application>

</manifest>
android reactjs chromecast content-security-policy mixed-content
2个回答
2
投票

如果要投射HTTP视频，则需要通过HTTP加载cast_receiver_framework，以避免混合内容。 Google 的投射接收器使用无方案 URL，例如：

<script src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js"></script>

// www.gstatic.com 表示将按照当前页面加载方案加载。您的应用程序应通过 HTTP 加载，然后所有库也将通过 HTTP 运行。

或者，您可以使用 upgrade-insecure-requests CSP 指令并放置：

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

进入

<head>
部分。在这种情况下，浏览器会“神奇地”将所有 HTTP 请求替换为 HTTPS 请求。此变体比 HTTP 更安全，但播放的视频应该可以通过 HTTPS 访问。

0
投票

已经很晚了。但以防万一有人来到这里寻找解决方案：

参数“android:usesCleartextTraffic="true"”应该添加到应用程序节点中，而不是添加到清单节点中。我的意思是：

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
  package="com.iptvapp"
  android:targetSandboxVersion="1">

    <uses-permission android:name="android.permission.INTERNET" />

    <application
      android:usesCleartextTraffic="true"
      android:name=".MainApplication"
      android:label="@string/app_name"
      android:icon="@mipmap/ic_launcher"
      android:roundIcon="@mipmap/ic_launcher_round"
      android:allowBackup="false"
      android:networkSecurityConfig="@xml/network_security_config"
      android:theme="@style/AppTheme">
      <meta-data
        android:name="com.google.android.gms.cast.framework.OPTIONS_PROVIDER_CLASS_NAME"
        android:value="com.reactnative.googlecast.GoogleCastOptionsProvider" />
      <activity
        android:name=".MainActivity"
        android:label="@string/app_name"
        android:configChanges="keyboard|keyboardHidden|orientation|screenSize|uiMode"
        android:launchMode="singleTask"
        android:windowSoftInputMode="adjustResize">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
      </activity>
      <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
    </application>

</manifest>
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.