android - 在 cordova 的 visual studio 工具中嵌入 youtube 视频

Question

我是 cordova visual studio 的新人。我想在适用于 cordova 2015 的 Visual Studio 工具中的 android 应用程序中嵌入或导入 youtube 视频。但是当我运行我的代码时它不显示任何视频。下面是代码。

    <div id="player">
        <iframe id="player" width="300" height="300" src="https://www.youtube.com/embed/sGPrx9bjgC8" frameborder="1" allowfullscreen> </iframe>
        <br />
    </div>
    <div>
        <a href="javascript:void(0);" id="play">Play</a>||
        <a href="javascript:void(0);" id="pause">Pause</a>||
        <a href="javascript:void(0);" id="mute">Mute</a>||
        <a href="javascript:void(0);" id="unmute">UnMute</a>
    </div>

    <script type="text/javascript" src="cordova.js"></script>
    <script type="text/javascript" src="scripts/platformOverrides.js"></script>
    <!--<script type="text/javascript" src="scripts/index.js"></script>-->
</body>

这是我运行代码时的图像。

Answer 1

首先，你需要安装cordova-whitelist-plugin如果你没有。

在您的 HTML 文件中，您必须包含以下元标记。它允许 iframe 到 Youtube。

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; frame-src 'self' https://www.youtube.com/">

此外，您可以使用允许所有内容的标签:

<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">

最后你需要添加 <access>您的 config.xml 中的标签文件:

<access origin="https://www.youtube.com" />