用户启动的播放按钮不会触发视频在 iOS 中自动开始
我使用 flowplayer 在桌面上播放实时视频,对于触摸设备,我使用 flowplayer 的 ipad 插件在 HTML5 视频播放器中播放视频。这是我正在做的播放器的工作流程:
function authStream()
{
$.ajax({
dataType: 'jsonp',
data: 'jsonp=getToken',
jsonp: 'jsonp_callback',
url:'http://server/getToken?channelId=id of the channel played',
success:function(data){
}
});
return;
}
function getToken(data)
{
if(data.ErrorCode == -1){
alert(data.message);
return;
}
if(!data.tk) {
alert('User not authorized to watch the show.');
return;
}
var token = "?token="+data.tk;
playVideo(token);
return;
}
$('#button1').click(function(){
authStream();
});
function playVideo(token){
var url;
if(isIpad || isIphone) {
url = 'http://server/live/_definst_/name of video/playlist.m3u8'+token;
} else {
url = 'name of video.sdp'+token;
}
$f("ipad", {'src': "flowplayer-3.2.7.swf", 'wmode': 'opaque'}, {
clip: {
url:url,
autoPlay: true,
live: true,
provider: 'rtmp',
scaling: 'orig'
},
plugins: {
rtmp: {
url: 'flowplayer.rtmp-3.2.3.swf',
netConnectionUrl:'rtmp://server/live/_definst_/'
}
},
onLoad : function() {
$f().play();
}
}).ipad();
}
现在的问题是视频自动播放在 ios(ipad、iphone)中无法工作。我知道这些设备默认情况下会阻止自动播放。为此,我使用 $f().play();
来触发自动播放。我尝试了几种使用它的方法,但无法使其工作。我发现的唯一可能的方法是当我在 $(document).ready()
中调用 authStream function
时,然后使用 $f().play();
$('#button1').click()
中的视频无需第二次点击即可在 ipad 中播放视频。我想做同样的工作,但不想在 $(document).ready()
中调用 authStream 函数
。我想做一些类似于我在示例代码中尝试的方法,并且还想在单击按钮时自动播放视频,而无需在 ipad 中第二次单击。现在我需要单击两次才能在触摸设备中播放视频。请任何人建议我可以尝试使该方法在 ios (ipad) 中工作的可能方法。
编辑: ipad html5 播放器中的播放控件似乎没有被触发。有没有办法通过点击#button1
来触发html5播放器的播放按钮。我没有任何想法让它发挥作用。
I am using flowplayer to play live video in desktop and for touch devices i am using the ipad plugin of flowplayer to play the video in the HTML5 video player. Here is the workflow of the player i am doing :
function authStream()
{
$.ajax({
dataType: 'jsonp',
data: 'jsonp=getToken',
jsonp: 'jsonp_callback',
url:'http://server/getToken?channelId=id of the channel played',
success:function(data){
}
});
return;
}
function getToken(data)
{
if(data.ErrorCode == -1){
alert(data.message);
return;
}
if(!data.tk) {
alert('User not authorized to watch the show.');
return;
}
var token = "?token="+data.tk;
playVideo(token);
return;
}
$('#button1').click(function(){
authStream();
});
function playVideo(token){
var url;
if(isIpad || isIphone) {
url = 'http://server/live/_definst_/name of video/playlist.m3u8'+token;
} else {
url = 'name of video.sdp'+token;
}
$f("ipad", {'src': "flowplayer-3.2.7.swf", 'wmode': 'opaque'}, {
clip: {
url:url,
autoPlay: true,
live: true,
provider: 'rtmp',
scaling: 'orig'
},
plugins: {
rtmp: {
url: 'flowplayer.rtmp-3.2.3.swf',
netConnectionUrl:'rtmp://server/live/_definst_/'
}
},
onLoad : function() {
$f().play();
}
}).ipad();
}
Now the problem is autoplay of video is not working in ios (ipad, iphone). I know autoplay by default is prevented for those devices. For this i am using $f().play();
to trigger the autoplay. I tried several methods of using it but could not make it work. The only possible way i found is when i call authStream function
in $(document).ready()
and then use $f().play();
in $('#button1').click()
the video plays without requiring to click for the second time to play the video in ipad. I want to do the same working but dont want to call authStream function
in $(document).ready()
. I want to do something like the way i tried in the sample code and also want to play video automatically on click of the button without requiring to click for the second time in ipad. Now i need to click twice to play the video in touch devices. Please anyone suggest what possible way i can try to make the method work in ios (ipad).
EDIT : It seems the play control in ipad html5 player does not get triggered. Is there any way to trigger the play button of html5 player from the click of #button1
. I am not getting any idea to make it work.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
我从未在 iOS 上尝试过 Flowplayer(我只使用纯 HTML5 播放器),但我的经验是,内置播放器仅在播放事件由用户触发时启动。似乎没有办法获得真正的自动播放功能。
编辑:
如果您想在单击播放按钮时发送 Ajax 请求,请尝试从 onStart 事件调用 authStream 方法 (
I never tried Flowplayer on iOS (I only used pure HTML5 player), but my expierence is, that the built-in player only starts if the play event is user triggered. Seems like there is no way to get a real autoplay functionality.
Edit:
If you want to send your Ajax request on click on play button, try calling your authStream method from onStart event (documentation):