標籤: 微信

iOS 省電模式時，任何影片都不會自動播放

<video id="player" controls autoplay x5-video-player-type="h5" playsinline="true" webkit-playsinline="true" x-webkit-airplay="true" x5-video-orientation="portraint" x5-video-player-fullscreen="true">
    <source src="..." type="video/mp4">
</video>

playsinline="true" webkit-playsinline="true
設定讓 iOS 不會全螢幕影片播放
x5-video-player-type="h5"
Android 設定影片層級為 html5 層級
x5-video-player-fullscreen="true"
Android 全螢幕設置，避免橫向顯示

iOS 微信可以通過 WeixinJSBridgeReady 事件來進行自動播放

document.addEventListener(
    'WeixinJSBridgeReady',
    function() {
        var video = document.getElementById("player");
        video.play();
    },
    false
);

Android 只能使用 touchstart 事件，提醒使用者點擊螢幕播放

document.addEventListener('touchstart', function(){ 
    var video = document.getElementById("player");
        video.play();
}, false);