涓€銆佸簲鐢ㄥ満鏅Щ鍔ㄧ鍏ㄥ睆瑙嗛鎾斁涓昏閬垮厤鍘熺敓video鏍囩瀛樺湪浠ヤ笅鍏煎鎬ч棶棰橈細鍘熺敓UI涓嶄竴鑷淬€傚浗鍐呮祻瑙堝櫒鍔寔鎾斁鍣紙鍚嶇О锛歈Q娴忚鍣紝鐧惧害娴忚鍣紝UC娴忚鍣?..锛夊唴鑱旀挱鏀撅紝瑙嗛灞傛瑕嗙洊涓嶄簡馃ぃ鍏朵粬闂2.JSMpeg浠嬬粛涓€涓敤JavaScript缂栧啓鐨勭敱MPEG-TSdemultiplexer缁勬垚鐨勮棰戞挱鏀惧櫒锛孧PEG1瑙嗛鍜孧P2闊抽瑙ｇ爜鍣ㄣ€乄ebGL鍜孋anvas2D娓叉煋鍣ㄤ互鍙奧ebAudio澹伴煶杈撳嚭鍙互閫氳繃Ajax鍔犺浇闈欐€佽棰戝苟鍏佽閫氳繃WebSockets杩涜浣庡欢杩熸祦寮忎紶杈擄紙~50姣锛夊彲浠ュ湪iPhone5S涓婁互30fps瑙ｇ爜720p瑙嗛鍙互鍦ㄤ换浣曡澶囦笂鎾斁瀹冪敤浜庣幇浠ｆ祻瑙堝櫒锛圕hrome銆丗irefox銆丼afari銆丒dge锛夛紝鍘嬬缉鍚庡彧鏈?0kb銆俧fmpeg璇︾粏瀹夎鏁欑▼浣跨敤FFmpeg鏁欑▼绠€涔ffmpeg浣跨敤鏁欑▼馃尠鏍楀瓙涓€锛歍ranscodeMP4鏍煎紡杞琓S鏍煎紡Transcode1.mp4瑙嗛杞棰憁peg1瑙嗛缂栫爜锛岀爜鐜?500k锛屾寜姣斾緥缂╂斁鍒板搴?50px锛岄煶棰憁p2缂栫爜鍑?ts瑙嗛ffmpeg\-i1.mp4\-fmpegts-codec:vmpeg1video-b:v3500k-vfscale=750:-1-codec:amp2\out.ts馃尠鏍楀瓙2锛氭姄鍙栬棰戞寚瀹氭ffmpeg\-ss00:00:00-t00:00:05\-i1.mp4-fmpegts-codec:vmpeg1video-b:v3500k-vfscale=750:-1-codec:amp2\out1.ts2銆傜紪鍐欑浉鍏充唬鐮佸鍏SMpeg搴?scriptsrc="jsmpeg.min.js">鏀剧疆瑙嗛瀹瑰櫒鍒涘缓瑙嗛瀵硅薄锛堣缁嗗弬鏁伴厤缃瀹樻柟鏂囨。锛塿ardemo=newJSMpeg.Player('https://jsmpeg.com/bjork-all-is-full-of-love.ts',{canvas:document.getElementById('video'),//containeridthrottled:false,//杩欓噷璁剧疆涓篺alse锛屽惁鍒檕nSourceCompleted涓嶄細琚Е鍙戜簨浠禼hunkSize:4*1024*1024,//鍒嗗潡鍔犺浇鏁版嵁鏃讹紝榛樿鍒嗗潡澶у皬涓?024*1024(1mb)progressive:false,//鏄惁鍒嗗潡鍔犺浇鏁版嵁loop:false,//鏄惁鍒嗗潡鍔犺浇寰幆鎾斁瑙嗛銆傞粯璁や负鐪?},onEnded:()=>{console.log('end')},onStalled:()=>{console.log('娌℃湁瓒冲鐨勬暟鎹挱鏀?)},onSourceEstablished:()=>{console.log('receiveddataforthefirsttime')}})playvideodemo.audioOut.unlock()//闇€瑕佺敤鎴蜂氦浜掕В閿侀煶棰戝嚱鏁癲emo.target.play()//鎾斁瑙嗛閿€姣佽棰戝璞emo.destroy()4.馃悶鍒嗗潡褰掓。鍔犺浇鏁版嵁鏃讹紝鎻愮ず璺ㄥ煙婧愮珯鏈厤缃厑璁歌法鍩熺爜鐜囬€夋嫨锛堜粠涓€瀹氱▼搴︿笂璁诧級1080*720鍒嗚鲸鐜囷紝浣跨敤5000K宸﹀彸鐨勭浉鍏抽棶棰?20*576鍒嗚鲸鐜囷紝浣跨敤3500K宸﹀彸鐨勫垎杈ㄧ巼640*480锛岀涓€娈佃棰戜娇鐢?500K宸﹀彸锛屽湪瀹夊崜澶ч儴鍒嗗師鐢熸祻瑙堝櫒涓婇煶鐢讳笉鍚屾锛岀涓€娈佃棰戝紑濮嬪墠鍚庡彴鎾斁1s瑙嗛.,鐩稿叧鏂囨。JSMpeg|瀹樼綉JSMpeg|githubJSMpeg浣跨敤1.涓绘祦瑙嗛瑙ｇ爜搴揓SMpegBroadway.jsogv.js宸茬粡娴嬭瘎锛孞SMpeg鏀寔杈冨ソ銆?js鍦ˋndroid娴忚鍣ㄤ腑瑙ｆ瀽webM瑙嗛鍧梶鎵嬫満h5瑙嗛瑙ｅ喅鏂规3.瑙嗛鎾斁鍣ㄧ浉鍏冲簱Chimee|涓€濂楀彲鎵╁睍鐨凥5瑙嗛鎾斁鍣ㄧ粍浠舵鏋惰タ鐡滄挱鏀惧櫒浠ヤ笂閮戒笉鏄疩Q娴忚鍣ㄣ€佺櫨搴︽祻瑙堝櫒灞傜骇鍜屾棤娉曞叧闂棶棰?.閫忔槑瑙嗛vap
