更新flashVars流媒体更改通过swfObject视频

我正在使用跨浏览器解决方案播放.mp4视频文件。我必须支持IE8及之后的版本。我正在使用这里提到的解决方案Dev-Metal。我已经成功配置了一切，它正在工作。更新flashVars流媒体更改通过swfObject视频

但是，我的要求涉及更改动态播放的视频使用javascript/jQuery。我已经成功完成了HTML5视频标签;但我在Flash播放器遇到问题。我是闪存集成的新手。

这里是我的html代码：

<video id="introPageVideoPlayer" controls="controls" poster="../script/videoplayer/img/demo.jpg" width="978" height="348"> 

<!-- .mp4 file for native playback in IE9+, Firefox, Chrome, Safari and most mobile browsers --> 
<source src="../script/videoplayer/vid/demo.mp4" type="video/mp4" /> 

<!-- flash fallback for IE6, IE7, IE8 and Opera --> 
<object type="application/x-shockwave-flash" 
    data="../script/videoplayer/swf/flowplayer-3.2.18.swf" width="978" height="348"> 

    <param name="movie" value="../script/videoplayer/swf/flowplayer-3.2.18.swf" /> 
    <param name="allowFullScreen" value="true" /> 
    <param name="wmode" value="transparent" /> 

    <!-- note the encoded path to the image and video files, relative to the .swf! --> 
    <param name="flashVars" value="config={'playlist':[ '..%2Fscript%2Fvideoplayer%2Fimg%2Fdemo.jpg', 
                {'url':'..%2Fscript%2Fvideoplayer%2Fvid%2Fdemo.mp4','autoPlay':false} 
                ]}" /> 

    <!-- fallback image if flash fails --> 
    <a href="http://get.adobe.com/flashplayer/"> 
     <img src="../script/videoplayer/img/noFlashPlayer.png" width="978" height="348" title="No Flash found" /> 
    </a> 
</object>

我也搜索了SO不同的解决方案。我现在试图使用swfObject。我曾尝试玩，但我只是不明白如何更新flashVars属性，因为它正在采取一个对象。

这里是我的javascript：

var flashvars = {}; 
     flashvars.??? = "SampleVideo.mp4"; 
     var params = {}; 
     params.allowfullscreen = "true"; 
     var attributes = {}; 
     swfobject.embedSWF("flowplayer-3.2.18.swf", "flashContainer", "800", "600", "9.0.0", false, flashvars, params, attributes);

请帮我在这方面。

来源

2015-06-10 SufianRashid

FlashVars并不意味着在嵌入后更新。如果您在SWF已经嵌入后需要发送新数据，则需要使用External Interface。

由于您使用的是FlowPlayer，因此应该坚持使用它们的API。它提供了一个method for dynamically loading video via JavaScript。

来源

2015-06-10 23:23:04 pipwerks

我能够使用jQuery和后备Flash视频使用SWFObject更改HTML 5视频。我在下面提供了我为此创建的简单JavaScript函数。

还提供了示例调用。只需将它传递给您要创建视频标记，视频网址，海报/图片网址和尺寸的标识;它会配置一切。

//Sample Call: createVideoPlayer('VideoContainer', '../video/Sample.mp4', 640, 480) 
function createVideoPlayer(videoContainerId, completeVideoUrl, posterPath, width, height) { 

var videoPlayerId = videoContainerId + 'VideoPlayer'; 
var flashPlayerId = videoContainerId + 'FlashPlayer'; //this id will be use by SWFObject 


//create new video tag and replace old html 
$('#' + videoContainerId).html(
    '<video preload="none" width="' + width + '" height="' + height + '" controls="controls" id="' + videoPlayerId + '" + poster="' + posterPath + '" >' 
    '<source src="' + completeVideoUrl + '" type="video/mp4"></source>' + 

    '<div id="' + flashPlayerId + '" class="flashPlayer">' + 
    '<object type="application/x-shockwave-flash" data="../videoplayer/swf/flowplayer-3.2.18.swf" width="' + width + '" height="' + height + '">' + 
    '<param name="movie" value="../videoplayer/swf/flowplayer-3.2.18.swf" />' + 
    '<param name="allowFullScreen" value="true" />' + 
    '<param name="wmode" value="transparent" />' + 
    '<param name="flashVars" value=\'config={"playlist":[ "' + encodeURI(posterPath) + '",{"url":"' + encodeURI(completeVideoUrl) + '","autoPlay":false}]}\' />' + 

    '<a href="http://get.adobe.com/flashplayer/"> <img src="../videoplayer/img/noFlashPlayer.png" width="' + width + '" height="' + height + '" title="No Flash found" /></a>' + 
    '</object>' + 
    '</div>' + 
    '</video>' 
); 

//set flash video using SWFObject 
setFlashVideo(completeVideoUrl, posterPath, flashPlayerId, width, height); 
} 


function setFlashVideo(completeVideoPath, completePosterImagePath, flashPlayerContainerId, width, height) { 

//Change the parameters using the swfObject 
var flashvars = {}; 

flashvars.config = "{'playlist':[ '" + encodeUrl(completePosterImagePath) + "',{'url':'" + encodeUrl(completeVideoPath) + "','autoPlay':false}]}"; 

var params = { 
    wmode: "transparent", 
    allowfullscreen: true 
}; 

var attributes = null; 

//embed flash 
swfobject.embedSWF(
    "../videoplayer/swf/flowplayer-3.2.18.swf", 
    flashPlayerContainerId, 
    width, height, 
    "9.0.0", 
    null, 
    flashvars, params, attributes 
); 
} 

function encodeUrl(url) { 
return encodeURIComponent(url).replace(/'/g, "%27").replace(/"/g, "%22"); 
}

来源

2015-07-27 12:01:40 SufianRashid

更新flashVars流媒体更改通过swfObject视频

回答

相关问题