整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
能是出于節省用戶流量，許多移動端瀏覽器都不支持H5自動播放視頻，必須在用戶主動交互（點擊或者滑動等）后才可以通過js播放視頻
PC端可以通過設置muted，自動播放靜音視頻
安卓瀏覽器均不支持自動播放，實測在微信內置瀏覽器，滑動視為交互行為，可以在這之后播放視頻，抖音內置瀏覽器則需要點擊交互，鴻蒙系統瀏覽器可以自動播放靜音視頻
進入網站時彈窗，例如歡迎語等，用戶點擊關閉后執行視頻播放
簡單粗暴的方法，在某些場景時適用的，實測在安卓、鴻蒙、IOS、抖音瀏覽器等均可以用這個方法解決
close() {
const videos = document.querySelectorAll('video');
for (let i = 0; i < videos.length; i++) {
const element = videos[i];
element.play();
}
}
【更多音視頻學習資料，點擊下方鏈接免費領取↓↓，先碼住不迷路~】
點擊領取→音視頻開發基礎知識和資料包
將視頻轉成ts格式，通過jsmpeg解碼器進行加載播放，可以實現自動播放，實測基本上可以解決所有移動端無法播放視頻的問題
轉ts
安裝ffmpeg，輸入命令將mp4轉成ts
ffmpeg.exe -i in.mp4 -f mpegts -codec:v mpeg1video -s 680x1080 -b:v 2074k -r 29.97 out.ts
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
// 引入jsmpeg
<script src="./jsmpeg.min.js"></script>
<style>
#canvas {
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<canvas id="canvas" height="750" width="750"></canvas>
<script>
var canvas = document.querySelector("#canvas");
// 加載ts文件
var player = new JSMpeg.Player("./out.ts", {
canvas: canvas,
loop: true, // 循環播放
autoplay: true, // 自動播放
audio: false, // 禁用音頻
});
player.play();
</script>
</body>
</html>
<video webkit-playsinline="webkit-playsinline" playsinline></video>如果你對音視頻開發感興趣，覺得文章對您有幫助，別忘了點贊、收藏哦！或者對本文的一些闡述有自己的看法，有任何問題，歡迎在下方評論區討論！
頻是網頁承載內容很重要的一個元素，也是必不可少的網頁表現形式（圖、文、表、視、音）之一。曾經網頁要想播放視頻、制作游戲，必須得用第三方插件flash。不僅編寫代碼要使用額外的語言，瀏覽器也必須得裝第三方插件，非常不方便。隨著html5標準逐漸普及，移動端、pc端開始拋棄flash，如今幾乎所有的瀏覽器都使用html5來制作視頻。
目標
flash是Adobe公司其中之一的產品。它發起于W3C與WHATWG的第五代web標準之爭，它撿了個大便宜，乘機定義網頁媒體標準。
W3C與WHATWG的第五代web標準之爭
flash填補了當時網頁只有文字和圖片的單調世界，將媒體（視頻、音頻、游戲）引入了網頁，將網頁帶進多彩的世界。
Flash能夠用僅僅十幾K到幾百K的體積，呈現出放大也不會失真的矢量彩色動圖，甚至還能夠做出足以令人沉迷一整天的Flash小游戲。
火柴人
Flash用第三方插件的身份，幾乎制霸了網頁媒體的標準，讓W3C尷尬不已，甚至從某種程度上說，讓真正的網頁標準推廣受阻。
2010年4月，蘋果CEO公開表示從此蘋果所有產品不再支持flash。flash從此慢慢喪失移動端的市場和地位。
喬布斯支持html5
2012年，安卓宣布不再支持Flash，從此flash徹底失去了移動端市場和地位。
2012年html5標準確立，html5在逐漸制霸移動端的地位時，也直接沖擊了flash僅剩的桌面市場，flash桌面市場的份額在逐步下降。
各大瀏覽器逐步默認禁用Flash，現2019年幾乎都全部禁用。
默認禁用Flash
Adobe將在2020年停止開發和更新flash。
2020年停止開發和更新flash
Flash以第三方插件的身份，做著平臺該做的事情，但沒有推動行業標準統一化，反而企圖私立標準。
隨著功能的增多，能解碼編碼H.264，能進行3D渲染，能播放7.1聲道環繞聲等，功能集于一身變得臃腫，效率變得低下。
Flash非常不安全。Flash能夠運行相當復雜的代碼，這讓Flash非常容易被滲透。加上Adobe在安全方面的不上心，這令Flash安全問題頻發。
Flash很不穩定。作為一個插件，它自身頻頻崩潰也就罷了，還經常拉著瀏覽器乃至操作系統一起殉情。
Flash加劇了手機的耗電量。
作用是在 HTML 頁面中嵌入視頻元素。Video定義視頻，比如電影片段或其他視頻流。
視頻播放
有四個是必須的屬性：src、controls、width、height屬性。
視頻播放代碼
<video> 元素支持三種視頻格式： MP4, WebM, 和 Ogg。
<source> 元素可以鏈接不同格式的視頻文件。瀏覽器將使用第一個可識別的格式。
支持多格式的視頻
video標簽體系
昨天發布Edge Dev重大版本更新之后，在今天發布的Edge Canary通道版本中還帶來了全新的主題設置，以及阻止多媒體自動播放的實驗Flag。目前基于Chromium的Edge瀏覽器支持來自Microsoft Store和Google Chrome Web Store的擴展程序，在今天的版本更新中可以按照商城不同來分類。
在最新的Edge Canary通道版本，在閱讀視圖下用戶可以將網頁保存至MHTML文件，此外還可以在PDF文件中查看DRM內容。在新增的主題設置中允許用戶不跟隨系統設置，手動選擇Light或者Dark主題。用戶可以在Menu > Settings > Appearance and Theme選項下進行調整。
最新Edge Canary通道版本還帶來了實現性的Flag--Limit media autoplay，能夠阻止部分網站的視頻自動播放。
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
