Pengekod/penyahkod audio dan video ialah satu set algoritma yang digunakan untuk mengekod dan menyahkod aliran audio atau video tertentu supaya audio dan video boleh dimainkan. Fail media mentah bersaiz sangat besar, dan jika ia tidak dikodkan, data yang membentuk klip video dan audio mungkin terlalu besar sehingga mengambil masa yang sukar untuk disebarkan melalui Internet. Tanpa penyahkod, penerima tidak boleh memasang semula data yang dikodkan ke dalam data media asal. Codec boleh membaca format bekas tertentu dan menyahkod trek audio dan video di dalamnya.
Memahami elemen media
1. Operasi asas: mengisytiharkan elemen media
Kod XML/HTMLSalin kandungan ke papan keratan
- <audio mengawal src="Adele-Set Fire To The Rain.mp3">
- Pelayar yang anda gunakan tidak menyokong audio HTML5
-
audio>
Atribut kawalan dalam kod memberitahu penyemak imbas untuk memaparkan kawalan pengguna biasa, termasuk mula, berhenti, langkau dan kawalan kelantangan. Jika atribut kawalan tidak ditentukan, pengguna tidak akan dapat memainkan audio pada halaman.
2. Gunakan elemen sumber
Dalam kes paling mudah, atribut src boleh menghala terus ke fail media Walau bagaimanapun, bagaimana jika penyemak imbas tidak menyokong bekas atau pengekod yang berkaitan? Ini memerlukan penggunaan pengisytiharan sandaran. Pelbagai sumber boleh disertakan dalam pernyataan sandaran dan penyemak imbas boleh memilih daripada begitu banyak sumber:
Kod XML/HTMLSalin kandungan ke papan keratan
- <audio mengawal>
-
<sumber src="Adele- Set Fire To The Rain.mp3" >
-
<sumber src="Adele- Set Fire To The Rain.ogg" >
-
audio>
Untuk sumber, penyemak imbas akan menilai mengikut susunan pengisytiharan Jika lebih daripada satu disokong, penyemak imbas akan memilih sumber pertama yang disokong.
3. Kawalan media
Dengan menetapkan automain atribut dalam elemen audio atau elemen video, fail audio atau video akan dimainkan secara automatik selepas dimuatkan tanpa sebarang interaksi pengguna.
Fungsi kawalan yang biasa digunakan
| 函数 |
动作 |
| load() |
加载音频/视频文件，为播放做准备，通常情况下不必调用，除非是动态生成的元素。用来在播放前预加载。 |
| play() |
加载（有必要的话）并播放音频/视频文件。除非音频/视频已经暂停在其他位置了，否则默认从头开始播放 |
| pause() |
暂停处于播放状态的音频/视频文件 |
| canPlayType(type) |
测试video元素是否支持给定MIME类型的文件 |
Sifat media baca sahaja
| 只读特性 |
值 |
| duration |
整个媒体文件的播放时长，以s为单位。如果无法获取时长，则返回NaN。 |
| paused |
如果媒体文件当前被暂停，则返回true。如果还未开始播放，则返回false。 |
| ended |
如果媒体文件已经播放完毕，则返回true |
| startTime |
返回最早的播放起始时间，一般是0.0，除非是缓冲过的媒体文件，并且一部分内容已经不在缓冲区 |
| error |
在发生了错误的情况下返回的错误代码 |
| currentSrc |
以字符串形式返回当前正在播放或已加载的文件。对应于浏览器在source元素中选择的文件。 |
Nilai sifat boleh skrip
| 特性 |
值 |
| autoplay |
将媒体文件设置为创建后自动播放，或者查询是否已设置为autoplay |
| loop |
如果媒体文件播放完毕后能重新播放则返回true，或者将媒体文件设置为循环播放（或者不循环播放） |
| currentTime |
以s为单位返回从开始播放到现在所用的时间。在播放过程中，设置currentTime来进行搜索，并定位到媒体文件的特定位置 |
| controls |
显示或隐藏用户控制界面，或者查询用户控制界面当前是否可见 |
| volume |
在0.0到1.0之间设置音频音量的相对值，或者查询当前音量的相对值。 |
| muted |
为音频文件设置静音或者消除静音，或者渐层当前是否为静音 |
| autobuffer |
通知播放器在媒体文件开始播放前，是否进行缓冲加载。如果媒体文件已经设置为autoplay，则忽略测特性。 |
3.1 Menggunakan elemen audio dan video
Elemen video HTML5 sangat serupa dengan elemen audio, tetapi mempunyai beberapa ciri lebih daripada elemen audio.
| 特性 |
值 |
| poster |
在视频加载完成之前，代表视频内容的图片的URL地址，可以想象一下“电影海报”。该特性不仅可读，而且可以修改，以便更换图片 |
| width、height |
读取或设置显示尺寸。如果设置的宽度与视频本身大小不匹配，可能导致居中显示，上下或左右可能出现黑色条状区域。 |
| videoWidth、videoHeight |
返回视频固有的或自适应的宽度和高度。只读video元素还有一个audio元素不支持的关键特性：可被HTML5 Canvas的函数调用。 |
Petua: Apabila kanvas menggunakan video sebagai sumber lukisan, hanya bingkai yang sedang dimainkan dilukis.
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
