我正试图在离子3移动应用程序中内嵌视频 - 我想避免启动原生视频播放器 .
我正在测试iPhone 5s - iOS 10 .
这是我根据我读过的所有内容创建的用于加载视频的功能：
loadVideo(src: string, onComplete?: (src: string) => void): void {
var video: HTMLVideoElement = document.createElement('video');
video.setAttribute('playsinline', '');
video.setAttribute('webkit-playsinline', '');
video.setAttribute('src', src);
var onVideoLoaded = () => {
video.removeEventListener('loadeddata', onVideoLoaded);
if (onComplete != null) onComplete(src);
};
video.addEventListener('loadeddata', onVideoLoaded);
video.load();
}
加载完成后，我通过video.play（）播放它 .
该功能的另一个版本是：
loadVideo(src: string, onComplete?: (src: string) => void): void {
var video: HTMLVideoElement = document.createElement('video');
video.setAttribute('playsinline', '');
video.setAttribute('webkit-playsinline', '');
var srcElement: HTMLSourceElement = document.createElement('source');
srcElement.setAttribute('src', src);
srcElement.setAttribute('type', 'video/mp4');
var onVideoLoaded = () => {
video.removeEventListener('loadeddata', onVideoLoaded);
if (onComplete != null) onComplete(src);
};
video.addEventListener('loadeddata', onVideoLoaded);
video.appendChild(srcElement);
video.load();
}
它使用source元素而不是video元素中的source属性 .
我还尝试直接在HTML中编写视频标签，以防Angular有一些代码来处理这个问题：
<video playsinline webkit-playsinline autoplay muted">
<source src="test.mp4" type="video/mp4">
</video>
由于自动播放不支持未静音的视频，我尝试通过HTML添加静音属性 . 当通过JavaScript添加它时，将其添加为属性似乎没有效果，而是我正在编写video.muted = true .
我尝试的另一件事是通过用户交互播放静音视频而不是自动播放它：
window.addEventListener('pointerdown', () => video.play());
我也尝试使用这个polyfill，它应该在iOS 8和9上模仿iOS 10的playinline：
enableInlineVideo(video, false);
https://github.com/bfred-it/iphone-inline-video
我尝试过的所有内容都会产生相同的结果 - 在iOS上，视频在原生播放器中全屏播放，即使它应该在线播放，而在Android上它按预期内联播放 .
1 回答
您是否在
config.xml中尝试了以下内容？哪个触发Native应用程序在Inline中播放 . 来到HTML5时，有一个有趣的事实在Apple Developer Site中说明