<嵌入>或者<对象>标签视频播放错误处理程序-JavaScript

<embed> or <object> tag video playback error handler - JavaScript

本文关键字：gt lt 处理 错误 程序 播放 -JavaScript 对象 嵌入 或者 标签      更新时间：2023-09-26

我试图通过将YouTube和其他视频嵌入HTML源代码来播放这些视频，以便在iOS中显示。

<embed>和<object>技术都有效，但当视频播放失败或传递给它的URL错误时，它们都不能调用回调函数(因此无法播放(。

我将此HTML代码与JavaScript一起用于适当的回调：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>video test</title>
<script type="text/javascript">
function errorEncountered()
{
    alert('Found error');
}
function loadingCompleted()
{
    alert("loading completed");
    //document.getElementById('youtubeObject').onerror="errorEncountered()";
    //alert(document.getElementById('youtubeObject'));
}
function clickCompleted()
{
    alert("Clicked on embedded object");
}
</script>
</head>
<body >
<div>
  <object
    id="youtubeObject"
    type="application/x-shockwave-flash"
    data="http://asdfasdf"
    width="643"
    height="400"
    onload="loadingCompleted()"
    onerror="errorEncountered()"
    onclick="clickCompleted()">
    <param name="movie" value="http://asdfasdf" />
    <param name="onError" value="errorEncountered()" />
    <!-- <param name="onload" value="loadingCompleted()" /> -->
    <param name="allowScriptAccess" value="always" />
    <param name="enablejsapi" value = "1" />
    <p>
    Couldn't load the video
    </p>
  </object>
</div>
<!-- document.getElementById('youtubeObject').onerror="errorEncountered()"; -->
<!-- document.getElementById('youtubeObject').addEventListener('onerror',function(){alert('error playing video')},true); -->
</body>
</html>
<!-- Actual Youtube URL "http://www.youtube.com/v/J_DV9b0x7v4" -->

用实际的YouTube URL替换错误的URL将播放视频。但错误的URL应该会触发JavaScript函数，但这并没有发生。

我已经检查了<object>的文档和相应的事件。<object>标记文档表示它响应的事件没有oneror或onload。但另一方面，oneror事件对象文档声明它受到<img>、<object>、<script>&<style>标签。

因此，我尝试插入"oneror"事件，将其作为<param>传递给<object>标记，以便插件能够处理它，或者，也尝试将它作为<object>标记的属性(只是碰碰运气(。对象的"onclick"属性会响应，但不会响应"oneror"answers"onload"。

尽管我的问题是，为什么传递给带有oneror的插件的<param>在传递错误的URL时不会触发onload？

我尝试了使用嵌入标记，但没有使用嵌入标记附加oneror和onload处理程序的范围。

有没有一种方法可以在视频加载/播放失败时从HTML中触发JavaScript函数(使用嵌入或对象技术(？

附言：我偶然发现了一些讨论这个问题的链接，但没有一个最终找到解决方案，这就是为什么我开始了这个新问题，我这样做是为了iOS的特定案例。

检测<嵌入>标签无法加载视频

http://www.webdeveloper.com/forum/showthread.php?t=590

感谢您的任何建议&帮助

添加：在CCD_ 13&</object>将在iPad模拟器中显示内容，但不会在设备本身上显示。甚至这也是我发现很难破解的谜题之一。

PS：我已经尝试过这个方法，对于youtube特定的，我尝试过添加onError回调，但它从未触发！使用了普通youtube指定的方式，我们可以插入youtube的onError回调：https://developers.google.com/youtube/iframe_api_reference#Loading_a_Video_Player

上面的问题是，我们必须创建一个YT.Player并将videoID设置为对象。这样就无法播放其他来源的视频。所以使用了一种稍微非常规的方式：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>video test</title>
<script type="text/javascript">
function errorEncountered(event)
{
    alert('Found error');
}
function errorFound()
{
    alert('Found error');
}
</script>
<script type='text/javascript' src='http://www.sandeshkadur.com/wp-content/themes/Gaia/js/video.js?ver=1.0'></script>
</head>
<body id="mainBody">
<iframe id = "youtube_vid" src="http://player.vimeo.com/video/28723846?color=ffffff" frameborder="0" width="640" height="360"></iframe>
<!-- From https://groups.google.com/forum/#!msg/youtube-api-gdata/myLe-SdMZ6w/tziw7W2LBv4J -->
<!-- <iframe  id="youtube_vid" src="asdfasdf"></iframe> -->
<script>
var player = document.getElementById("youtube_vid");
new YT.Player(player, {
            events: {
                'onStateChange': function(){console.log(arguments)},
                'onError': errorEncountered
            }
        });
</script>
</body>
</html>

这虽然它播放正确的视频，它不会得到错误回调的Youtube链接至少！

使用新的<iframe>嵌入代码：

<iframe width="420" height="315" src="http://www.youtube.com/embed/dQw4w9WgXcQ" frameborder="0" allowfullscreen></iframe>

YouTube将检测用户使用的平台，并提供适当的代码，即桌面用户的Flash、iOS用户的<video>等。

您可以通过单击"共享"按钮，然后单击"嵌入"按钮，找到此嵌入代码(在任何YouTube视频页面中(。

更新：您不会找到一个通用解决方案，可以在iOS设备上播放任何提供商的任何视频。提供商必须对视频进行专门编码，以便可以由Safari中的<video>元素播放。

我建议：

  • 查找您支持的每个视频网站的嵌入代码(而不是FLV源URL，即网站提供给用户的嵌入代码(。

  • 如果网站使用<iframe>，那么他们可能支持在iOS上播放。逐字逐句地使用此代码。

  • 如果网站使用Flash播放器，请使用SWFObject嵌入视频，而不是他们的<embed>代码。如果SWFObject检测到浏览器不支持Flash，它可以显示一些替代内容(例如，类似"对不起，您需要Flash才能观看此视频"的消息(。

  • 使用一个巨大的switch语句：

    switch (videoType):
case 'YouTube':
    // use YouTube iframe code
    break;
case 'Vimeo':
    // use Vimeo iframe code
    break;
// ...on and on...
default:
    // use SWFObject to embed
}

您在object tag中定义type="application/x-shockwave-flash"，但在哪里定义iOS的回退。如果你想特别针对iOS，为什么不使用video标签呢。中给出的文件http://websitehelpers.com/video/html.html将帮助您在iOS中播放视频对于iOS，您需要定义video tag，否则它不理解，或者您可以使用任何一个类似flowplayer的闪存播放器，该播放器支持iOS。您可以从http://flash.flowplayer.org/plugins/javascript/ipad.html.试着让我知道这是否解决了你的问题

更新：

请尝试以下<iframe id="frame" title="Youtube Video" width="320" height="194" scrolling="no" src='http://www.youtube.com/embed/J_DV9b0x7v4' frameborder="1"></iframe>。这在CCD_ 33和CCD_。J_DV9b0x7v4是您想要播放的视频。查看来自的演示http://jsfiddle.net/AAUgG/在CCD_ 36中。这应该可以解决您想要的目的。

相关文章：