Question

我目前正在开发一个移动Phonegap“网站包装”应用程序;也就是说，我只是从index.html重定向到我的网址：

window.location.href=myUrl;

它打开InAppBrowser中的页面。大多数功能似乎都运行得很好;但是，我在使用手机播放网站上的任何视频时遇到问题。

我的第一印象是它与跨域政策问题有关，这使我相信也许我必须做一些白名单。但是，如果是这种情况，我还是找不到解决办法。

我目前得到的错误（在我用于测试的Android手机上）：

Error: Failed to load because no supported source was found.

更具体的细节：

我无法直接控制我重定向的网站
视频位于iFrame中，而src全部来自Vimeo
视频缩略图似乎正在加载
每个iFrame都有一个子（包含在几个div中）视频元素，其结构如下：<video preload src="blob:https://player.vimeo.com/xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"></video>，x代表字母数字字符。我不熟悉blob的目的，我想知道它是否与手头的问题有关...

我的HTML：

<!DOCTYPE html>
<html>
<head>
  <title>My Title</title>
  <meta charset="utf-8" />
  <meta name="format-detection" content="telephone=no" />
  <meta name="msapplication-tap-highlight" content="no" />
</head>
<body>
  <script>
    window.location.href=myURL;  //where myURL is the URL of the site I am using
  </script>
</body>
</html>

我的config.xml（我知道它以各种方式非常混乱和不完整）：

<?xml version='1.0' encoding='utf-8'?>
<widget id="com.phonegap.myId" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0">
    <name>My App Name here.</name>
    <description>
        My description here.
    </description>
    <author email="my@email.here" href="href.here">
        My author here.
    </author>
    <content src="index.html" />
    <preference name="DisallowOverscroll" value="true" />
    <preference name="android-minSdkVersion" value="14" />
    <plugin name="cordova-plugin-battery-status" source="npm" spec="~1.1.1" />
    <plugin name="cordova-plugin-camera" source="npm" spec="~2.1.1" />
    <plugin name="cordova-plugin-media-capture" source="npm" spec="~1.2.0" />
    <plugin name="cordova-plugin-console" source="npm" spec="~1.0.2" />
    <plugin name="cordova-plugin-contacts" source="npm" spec="~2.0.1" />
    <plugin name="cordova-plugin-device" source="npm" spec="~1.1.1" />
    <plugin name="cordova-plugin-device-motion" source="npm" spec="~1.2.0" />
    <plugin name="cordova-plugin-device-orientation" source="npm" spec="~1.0.2" />
    <plugin name="cordova-plugin-dialogs" source="npm" spec="~1.2.0" />
    <plugin name="cordova-plugin-file" source="npm" spec="~4.1.1" />
    <plugin name="cordova-plugin-file-transfer" source="npm" spec="~1.5.0" />
    <plugin name="cordova-plugin-geolocation" source="npm" spec="~2.1.0" />
    <plugin name="cordova-plugin-globalization" source="npm" spec="~1.0.3" />
    <plugin name="cordova-plugin-inappbrowser" source="npm" spec="~1.3.0" />
    <plugin name="cordova-plugin-media" source="npm" spec="~2.2.0" />
    <plugin name="cordova-plugin-network-information" source="npm" spec="~1.2.0" />
    <plugin name="cordova-plugin-splashscreen" source="npm" spec="~3.2.1" />
    <plugin name="cordova-plugin-statusbar" source="npm" spec="~2.1.2" />
    <plugin name="cordova-plugin-vibration" source="npm" spec="~2.1.0" />
    <platform name="android">
        <icon src="www/res/icon/android/icon.png" width="672" height="672"/>
    </platform>
    <platform name="ios">
        <icon src="www/res/icon/ios/icon.png" width="672" height="672"/>
    </platform>
    <platform name="wp8">
        <icon height="99" platform="wp8" src="www/res/icon/wp8/ApplicationIcon.png" width="99" />
        <icon height="159" platform="wp8" src="www/res/icon/wp8/Background.png" width="159" />
        <splash height="1280" platform="wp8" src="www/res/screen/wp8/screen-portrait.jpg" width="768" />
    </platform>
    <platform name="windows">
        <icon height="150" platform="windows" src="www/res/icon/windows/Square150x150Logo.scale-100.png" width="150" />
        <icon height="30" platform="windows" src="www/res/icon/windows/Square30x30Logo.scale-100.png" width="30" />
        <icon height="50" platform="windows" src="www/res/icon/windows/StoreLogo.scale-100.png" width="50" />
        <splash height="300" platform="windows" src="www/res/screen/windows/SplashScreen.scale-100.png" width="620" />
        <icon height="120" platform="windows" src="www/res/icon/windows/StoreLogo.scale-240.png" width="120" />
        <icon height="44" platform="windows" src="www/res/icon/windows/Square44x44Logo.scale-100.png" width="44" />
        <icon height="106" platform="windows" src="www/res/icon/windows/Square44x44Logo.scale-240.png" width="106" />
        <icon height="70" platform="windows" src="www/res/icon/windows/Square70x70Logo.scale-100.png" width="70" />
        <icon height="71" platform="windows" src="www/res/icon/windows/Square71x71Logo.scale-100.png" width="71" />
        <icon height="170" platform="windows" src="www/res/icon/windows/Square71x71Logo.scale-240.png" width="170" />
        <icon height="360" platform="windows" src="www/res/icon/windows/Square150x150Logo.scale-240.png" width="360" />
        <icon height="310" platform="windows" src="www/res/icon/windows/Square310x310Logo.scale-100.png" width="310" />
        <icon height="150" platform="windows" src="www/res/icon/windows/Wide310x150Logo.scale-100.png" width="310" />
        <icon height="360" platform="windows" src="www/res/icon/windows/Wide310x150Logo.scale-240.png" width="744" />
        <splash height="1920" platform="windows" src="www/res/screen/windows/SplashScreenPhone.scale-240.png" width="1152" />
    </platform>
    <access origin="https://myURL.com/" subdomains="true" />
    <allow-navigation href="https://myURL.com/*" />
    <access origin="*" />
    <allow-navigation href="*" />
    <allow-navigation href="blob:*" />
    <allow-intent href="*"/>
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <allow-intent href="blob:*"/>
    <platform name="android">
        <allow-intent href="market:*" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
    </platform>
    <plugin name="cordova-plugin-whitelist" spec="https://github.com/apache/cordova-plugin-whitelist.git" />
</widget>

我四处寻找解决这个问题的方法，但无济于事。任何帮助将不胜感激。

作为旁注，如果有人建议更好地完成我正在尝试用这个项目做的事情，请告诉我，我将在未来牢记这一点。

Answer 1

首先1：

别忘了放视频标签：

<video width="320" height="240" controls>
    <source src="movie.mp4" type="video/mp4">
      <source src="movie.ogg" type="video/ogg">
      Your browser does not support the video tag.
</video>

`NOTE:`

1. The file:// protocol to play something native to the device such as: window.plugins.videoPlayer.play("file:///sdcard/MyMovie.mp4");

2. The http:// protocol to play something on the internet such as: window.plugins.videoPlayer.play("http://path.to.my/file.mp4");

3. The http:// protocol pointing to a video on YouTube such as: window.plugins.videoPlayer.play("http://www.youtube.com/watch?v=E0UV5i5jY50");

第二场2：

您可以使用：VideoPlayer

Answer 2

所以，事实证明问题实际上是我的手机。究竟是什么，我不能说，但它在不同的Android手机上工作得很好......

Phonegap Video“无法加载，因为找不到支持的来源”

2 个答案:

`NOTE:`

第二场2：