Posted 姝g鎶€

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了相关的知识,希望对你有一定的参考价值。

2021锛屾垜绮惧績鍒朵綔浜嗕竴寮燜lash鏂板勾璐哄崱锛屾墍鏈夌殑绁濈閮藉湪鏂囧瓧閲屼簡馃憞

馃憜 鏂板勾绁濈


鎴戠殑鏂板勾绁濈宸茬粡閫佺粰浣犱簡锛屽鏋滄敹涓嶅埌锛岄偅鍙兘鎬狥lash涓嶄簤姘斾簡銆?/span>

鈺?鈺柦鈺?鈺?/span>


閬ユ兂Flash褰撳勾锛岀綉椤靛垵瀚佷簡锛岄泟濮胯嫳鍙戙€傜窘鎵囩憾宸撅紝璋堢瑧闂达紝妯┕鐏伴鐑熺伃銆傞偅鏃剁殑Flash鍙槸绁炰竴鑸殑瀛樺湪鍟婏紝鍑犱箮鎵€鏈夌綉椤甸兘鏈夌潃瀹冪殑韬奖銆傚彲濡備粖锛屽氨鍦ㄦ槰澶┾€︹€?/p>

娌歌吘锛丠TML5涔熻兘鎾斁.flv瑙嗛锛?></p> 
<p>Flash瀵跨粓灏卞瘽浜嗭紒<br></p> 
<p><br></p> 
<p>鐪熺殑寰堥毦鎯宠薄锛屾敮鎾戜簡浜掕仈缃戝崐澹佹睙灞辩殑鈥滆法濯掍綋澶氬钩鍙板伐鍏封€滷lash锛屼細鍦ㄥ崄鍑犲勾鍚庨伃鍒?鈥滃叏缃戝皝鏉€鈥濄€傞櫎浜嗛棰戝彂甯冪鐢ㄦ彁绀虹殑鍚勪釜娴忚鍣紝鐢氳嚦杩炲叾姣嶅叕鍙窤dobe涔熷湪2017骞?鏈堝甯冿紝2021骞村皢鈥滄姏寮冣€滷lash锛屽仠姝竴鍒囨敮鎸併€?/p> 
<p><br></p> 
<p>褰撶劧锛岃娣樻卑鐨凢lash寰堝ぇ鍘熷洜鍦ㄤ簬鑷韩锛孎lash鐨勬紡娲炲疄鍦ㄥお澶氫簡锛岄粦瀹㈠彲浠ヨ交鑰屾槗涓惧叆渚典綘鐨勮绠楁満锛孉dobe琛ラ兘琛ヤ笉杩囨潵锛屾斁寮冩湭鍏嶄笉鏄竴涓纭殑鍐冲畾銆?/p> 
<p><br></p> 
<p>闄ゅ紑瀹夊叏鎬ч棶棰橈紝鑷韩鍔熻兘杩囦簬鍐楁潅涔熷緢妫樻墜銆備娇鐢‵lash浼氬崰鐢ㄨ緝澶氱殑澶勭悊鍣ㄨ祫婧愶紝瀵艰嚧璁惧涓ラ噸鍙戠儹銆佺画鑸缉鐭€︹€﹁繖浜涢棶棰樹娇寰桭lash璺熶笉涓婄Щ鍔ㄨ澶囩殑娼祦銆傛瘯绔燂紝璋佷篃涓嶆兂鍦ㄧ瑪璁版湰涓婂湪绾跨湅涓棰戯紝30鍒嗛挓灏辨悶鍒扮數鑴戞病鐢靛惂锛?/p> 
<p><br></p> 
<p>涓庢鍚屾椂锛孒TML5绛夋洿涓哄紑鏀剧殑鎶€鏈笌鏍囧噯閫愭笎瀹屽杽锛屾洿杩涗竴姝ュ帇缂╀簡Flash鐨勪娇鐢ㄥ満鏅€傜幇鍦ㄤ富娴佺殑瑙嗛缃戠珯锛岄兘棣栭€変娇鐢℉TML5鎾斁鍣紝灏辫繛鈥淔LASH濮嬬鈥?399涔熸槸濡傛銆傗€滄祻瑙堝櫒蹇呴』浣跨敤Flash鈥濈殑鐞嗙敱瓒婃潵瓒婂皯銆?/p> 
<p><br></p> 
<p class=娌歌吘锛丠TML5涔熻兘鎾斁.flv瑙嗛锛?></p> 
<p><span class=馃憜 4399缃戦〉鐣岄潰


褰撶劧锛孒TML涔熷瓨鍦?span>缂洪櫡锛堝ソ瀹朵紮锛屾壇浜嗗崐澶╃粓浜庣湅鏍囬浜嗭級銆?/p>

(lll锟⑾夛竣)


HTML5鍜屾祻瑙堝櫒瀵硅棰戝拰闊抽鏂囦欢鏍煎紡閮芥湁涓ユ牸鐨勮姹傦紝浠呮湁灏戞暟鍑犵瑙嗛鍜岄煶棰戞牸寮忕殑鏂囦欢鑳藉鍚屾椂婊¤冻HTML5鍜屾祻瑙堝櫒鐨勯渶姹傘€?/p>


鍥犳鎯宠鍦ㄧ綉椤典腑宓屽叆瑙嗛鍜岄煶棰戞枃浠讹紝棣栧厛瑕侀€夋嫨姝g‘鐨勮棰戝拰闊抽鏂囦欢鏍煎紡銆備笅闈㈠皢瀵笻TML5涓棰戝拰闊抽鐨勪竴浜涘父瑙佹牸寮忎互鍙婃祻瑙堝櫒鐨勬敮鎸佹儏鍐靛仛鍏蜂綋浠嬬粛銆?/p>


HTML5鏀寔鐨勮棰戞牸寮忓湪HTML5涓祵鍏ョ殑瑙嗛鏍煎紡涓昏鍖呮嫭ogg銆乵peg4銆亀ehm绛夛紝鍏蜂綋浠嬬粛濡備笅銆?/p>


ogg锛?/strong>涓€绉嶅紑婧愮殑瑙嗛灏佽瀹瑰櫒锛屽叾瑙嗛鏂囦欢鎵╁睍鍚嶄负.ogg锛岄噷闈㈠彲浠ュ皝瑁卾obris闊抽缂栫爜鎴栬€卼heora瑙嗛缂栫爜锛屽悓鏃秓gg鏂囦欢涔熻兘灏嗛煶棰戠紪鐮佸拰瑙嗛缂栫爜杩涜娣峰悎灏佽銆?/span>


mpeg4锛?/strong>鐩墠鏈€娴佽鐨勮棰戞牸寮忥紝鍏惰棰戞枃浠舵墿灞曞悕涓?mp4銆傚悓绛夋潯浠朵笅锛宮peg4鏍煎紡鐨勮棰戣川閲忚緝濂斤紝浣嗗畠鐨勪笓鍒╄MPEG锛峀A鍏徃鎺у埗锛屼换浣曟敮鎸佹挱鏀緈peg4瑙嗛鐨勮澶囷紝閮藉繀椤绘湁涓€寮燤PEG锛峀A棰佸彂鐨勮鍙瘉銆傜洰鍓峂PEG锛峀A瑙勫畾锛屽彧瑕佹槸浜掕仈缃戜笂鍏嶈垂鎾斁鐨勮棰戯紝鍧囧彲浠ユ棤鍋胯幏寰椾娇鐢ㄨ鍙瘉銆?/span>


Webm锛?/strong>鐢盙oogle鍙戝竷鐨勪竴涓紑鏀俱€佸厤璐圭殑濯掍綋鏂囦欢鏍煎紡锛屽叾瑙嗛鏂囦欢鎵╁睍鍚嶄负.webm銆傜敱浜?webm鏍煎紡鐨勮棰戣川閲忓拰mpeg4杈冧负鎺ヨ繎锛屽苟涓旀病鏈変笓鍒╅檺鍒剁瓑闂锛屾墍浠?webm宸茬粡琚秺鏉ヨ秺澶氱殑浜烘墍浣跨敤銆?/span>


鍙槸Flash鏃朵唬杩橀仐鐣欑潃涓€浜涢棶棰橈紝.flv瑙嗛鏃犳硶鐩存帴閫氳繃HTML5鎾斁锛屽緢澶氳棰戠綉绔欏墠鏈熷畬鍏ㄤ緷璧朏lash鎾斁鑰岄€夋嫨.flv鏍煎紡锛屾墍浠ュ湪HTML鏃朵唬锛岃.flv鍦℉TML涓婃挱鏀炬槸涓嶅緱涓嶈В鍐崇殑闂銆傛垜浠€崇啛鑳借鐨凚绔欏綋鍓嶈繕鏄娇鐢?flv瑙嗛锛屼笖褰撳墠鍙互鍦℉TML涓婅繘琛屾挱鏀俱€?/p>


娌歌吘锛丠TML5涔熻兘鎾斁.flv瑙嗛锛?></p> 
<p><span class=馃憜 Bilibili寮瑰箷缃戠綉椤电晫闈?/span>


杩欏緱鐩婁簬鍓岯ilibili寮€鍙戣€咃紝鐭ヤ箮ID锛堣唉璋︼級鎻愪緵鐨刦lv.js鏂规锛屽綋鍓嶈椤圭洰宸插紑婧愩€傛牴鎹寮€鍙戣€呯殑鍥炵瓟鍙煡锛?/p>

flv.js 鍋氫簡涓変欢浜?/span>
1. HTML5 鍘熺敓浠呮敮鎸佹挱鏀?mp4/webm 鏍煎紡锛宖lv.js 瀹炵幇浜嗗湪 HTML5 涓婃挱鏀?FLV 鏍煎紡瑙嗛銆?br>2. 浣?Bilibili 缃戦〉绔钩婊戣繃搴﹀埌 HTML5 鎾斁鍣紝鍘嗗彶閬楃暀涓嶅啀鏄殰纰嶃€?br>3. 瀵逛簬瑙嗛鐩存挱锛屽湪 HTML5 涓婃敮鎸佷簡寤惰繜鏋佷綆 HTTP FLV 鎾斁锛岃В寮€缃戦〉绔洿鎾 Flash 鐨勪緷璧栥€?/span>


娌歌吘锛丠TML5涔熻兘鎾斁.flv瑙嗛锛?></p> 
<p><span class=馃敆鐭ヤ箮閾炬帴锛歨ttps://www.zhihu.com/question/51997376


娌歌吘锛丠TML5涔熻兘鎾斁.flv瑙嗛锛?></p> 
<p><span class=馃敆椤圭洰閾炬帴锛歨ttps://github.com/Bilibili/flv.js


鍦ㄧ嚎婕旂ず锛?/strong>

馃敆https://file.ssss.fun/?/%E5%8D%9A%E5%AE%A2%E6%96%87%E4%BB%B6/%E9%99%84%E4%BB%B6%E4%B8%8B%E8%BD%BD/21010200/flv.js%20Demo/


娌歌吘锛丠TML5涔熻兘鎾斁.flv瑙嗛锛?></p> 
<p class=馃憜 html鎾斁.flv婕旂ず鐣岄潰


娉ㄦ剰锛?/span>

璺ㄥ煙浼氭姤閿欙紝鏈夌┖鎴戝啀鍐欒В鍐宠法鍩熸柟妗堬紝鎮ㄥ彲鍏堟墦寮€涓嬫柟閾炬帴瀵绘眰甯姪锛?/span>

馃敆甯姪閾炬帴锛?/span>http://t.ssss.fun/baidu/?q=5aaC5L2V6Kej5Yaz6Leo6LaK6Zeu6aKY


婕旂ず浠g爜锛?/span>

<!DOCTYPE html><html>
<head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"> <title>flv.js demo</title>
<style>
.mainContainer { display: block; width: 100%; margin-left: auto; margin-right: auto;}@media screen and (min-width: 1152px) { .mainContainer { display: block; width: 1152px; margin-left: auto; margin-right: auto; }}
.video-container { position: relative; margin-top: 8px;}
.video-container:before { display: block; content: ""; width: 100%; padding-bottom: 56.25%;}
.video-container > div { position: absolute; top: 0; left: 0; right: 0; bottom: 0;}
.video-container video { width: 100%; height: 100%;}
.urlInput { display: block; width: 100%; margin-left: auto; margin-right: auto; margin-top: 8px; margin-bottom: 8px;}
.centeredVideo { display: block; width: 100%; height: 100%; margin-left: auto; margin-right: auto; margin-bottom: auto;}
.controls { display: block; width: 100%; text-align: left; margin-left: auto; margin-right: auto; margin-top: 8px; margin-bottom: 10px;}
.logcatBox { border-color: #CCCCCC; font-size: 11px; font-family: Menlo, Consolas, monospace; display: block; width: 100%; text-align: left; margin-left: auto; margin-right: auto;}
.url-input , .options { font-size: 13px;}
.url-input { display: flex;}
.url-input label { flex: initial;}
.url-input input { flex: auto; margin-left: 8px;}
.url-input button { flex: initial; margin-left: 8px;}
.options { margin-top: 5px;}
.hidden { display: none;}</style>
</head>
<body>
<div class="mainContainer"> <div> <div id="streamURL"> <div class="url-input"> <label for="sURL">Stream URL:</label> <input id="sURL" type="text" value="https://download.ssss.fun/?url=https%3A%2F%2Ffile.ssss.fun%2F%3F%2F%25E5%25A8%25B1%25E4%25B9%2590%25E4%25B8%25AD%25E5%25BF%2583%2F%25E8%25A7%2586%25E9%25A2%2591%2F%25E5%2585%25A8%25E9%2583%25A8%2F%25E5%25A4%25BA%25E5%2586%25A0.flv" /> <button onclick="switch_mds()">Switch to MediaDataSource</button> </div> <div class="options"> <input type="checkbox" id="isLive" onchange="saveSettings()" /> <label for="isLive">isLive</label> <input type="checkbox" id="withCredentials" onchange="saveSettings()" /> <label for="withCredentials">withCredentials</label> <input type="checkbox" id="hasAudio" onchange="saveSettings()" checked /> <label for="hasAudio">hasAudio</label> <input type="checkbox" id="hasVideo" onchange="saveSettings()" checked /> <label for="hasVideo">hasVideo</label> </div> </div> <div id="mediaSourceURL" class="hidden"> <div class="url-input"> <label for="msURL">MediaDataSource JsonURL:</label> <input id="msURL" type="text" value="http://127.0.0.1/flv/7182741.json" /> <button onclick="switch_url()">Switch to URL</button> </div> </div> </div> <div class="video-container"> <div> <video name="videoElement" class="centeredVideo" controls autoplay> Your browser is too old which doesn't support HTML5 video. </video> </div> </div> <div class="controls"> <button onclick="flv_load()">Load</button> <button onclick="flv_start()">Start</button> <button onclick="flv_pause()">Pause</button> <button onclick="flv_destroy()">Destroy</button> <input style="width:100px" type="text" name="seekpoint"/> <button onclick="flv_seekto()">SeekTo</button> </div> <textarea name="logcatbox" class="logcatBox" rows="10" readonly></textarea> </div>
<script src="https://cdn.ssss.fun/flv.js/flv.js"></script>
<script> var checkBoxFields = ['isLive', 'withCredentials', 'hasAudio', 'hasVideo']; var streamURL, mediaSourceURL;
function flv_load() { console.log('isSupported: ' + flvjs.isSupported()); if (mediaSourceURL.className === '') { var url = document.getElementById('msURL').value;
var xhr = new XMLHttpRequest(); xhr.open('GET', url, true); xhr.onload = function (e) { var mediaDataSource = JSON.parse(xhr.response); flv_load_mds(mediaDataSource); } xhr.send(); } else { var i; var mediaDataSource = { type: 'flv' }; for (i = 0; i < checkBoxFields.length; i++) { var field = checkBoxFields[i]; /** @type {HTMLInputElement} */ var checkbox = document.getElementById(field); mediaDataSource[field] = checkbox.checked; } mediaDataSource['url'] = document.getElementById('sURL').value; console.log('MediaDataSource', mediaDataSource); flv_load_mds(mediaDataSource); } }
function flv_load_mds(mediaDataSource) { var element = document.getElementsByName('videoElement')[0]; if (typeof player !== "undefined") { if (player != null) { player.unload(); player.detachMediaElement(); player.destroy(); player = null; } } player = flvjs.createPlayer(mediaDataSource, { enableWorker: false, lazyLoadMaxDuration: 3 * 60, seekType: 'range', }); player.attachMediaElement(element); player.load(); }
function flv_start() { player.play(); }
function flv_pause() { player.pause(); }
function flv_destroy() { player.pause(); player.unload(); player.detachMediaElement(); player.destroy(); player = null; }
function flv_seekto() { var input = document.getElementsByName('seekpoint')[0]; player.currentTime = parseFloat(input.value); }
function switch_url() { streamURL.className = ''; mediaSourceURL.className = 'hidden'; saveSettings(); }
function switch_mds() { streamURL.className = 'hidden'; mediaSourceURL.className = ''; saveSettings(); }
function ls_get(key, def) { try { var ret = localStorage.getItem('flvjs_demo.' + key); if (ret === null) { ret = def; } return ret; } catch (e) {} return def; }
function ls_set(key, value) { try { localStorage.setItem('flvjs_demo.' + key, value); } catch (e) {} }
function saveSettings() { if (mediaSourceURL.className === '') { ls_set('inputMode', 'MediaDataSource'); } else { ls_set('inputMode', 'StreamURL'); } var i; for (i = 0; i < checkBoxFields.length; i++) { var field = checkBoxFields[i]; /** @type {HTMLInputElement} */ var checkbox = document.getElementById(field); ls_set(field, checkbox.checked ? '1' : '0'); } var msURL = document.getElementById('msURL'); var sURL = document.getElementById('sURL'); ls_set('msURL', msURL.value); ls_set('sURL', sURL.value); console.log('save'); }
function loadSettings() { var i; for (i = 0; i < checkBoxFields.length; i++) { var field = checkBoxFields[i]; /** @type {HTMLInputElement} */ var checkbox = document.getElementById(field); var c = ls_get(field, checkbox.checked ? '1' : '0'); checkbox.checked = c === '1' ? true : false; }
var msURL = document.getElementById('msURL'); var sURL = document.getElementById('sURL'); msURL.value = ls_get('msURL', msURL.value); sURL.value = ls_get('sURL', sURL.value); if (ls_get('inputMode', 'StreamURL') === 'StreamURL') { switch_url(); } else { switch_mds(); } }
function showVersion() { var version = flvjs.version; document.title = document.title + " (v" + version + ")"; }
var logcatbox = document.getElementsByName('logcatbox')[0]; flvjs.LoggingControl.addLogListener(function(type, str) { logcatbox.value = logcatbox.value + str + ' '; logcatbox.scrollTop = logcatbox.scrollHeight; });
document.addEventListener('DOMContentLoaded', function () { streamURL = document.getElementById('streamURL'); mediaSourceURL = document.getElementById('mediaSourceURL'); loadSettings(); showVersion(); flv_load(); });</script>
</body>
</html>




鏂囨湯涓嶅紩娴侊紝鍙眰鎵撹祻

( $ _ $ )

馃敆鎵撹祻閾炬帴锛歨ttps://pay.ssss.fun

以上是关于的主要内容,如果未能解决你的问题,请参考以下文章

谷歌浏览器调试jsp 引入代码片段,如何调试代码片段中的js

片段和活动之间的核心区别是啥?哪些代码可以写成片段?

VSCode自定义代码片段——.vue文件的模板

VSCode自定义代码片段6——CSS选择器

VSCode自定义代码片段——声明函数

VSCode自定义代码片段8——声明函数