如何修改video標簽的內部媒體控件下載事件？

Question

video標簽有下載按鈕，是否可以修改下載事件。

例如修改下載文件名。

我已嘗試修改視頻標簽的download屬性，但不適用於問題如何設置 blob 數據的下載文件擴展名中所述的 blob video src

注意，要檢查視頻標簽的下載按鈕，

Settings|Preferences -> Elements -> Show user agent shadow DOM

Answer 1

下載控制實際上不是 HTML5 規范的一部分，而是由用戶代理（即瀏覽器）實現的。

瀏覽器可能會以不同方式實現控件，但大多數瀏覽器都允許通過右鍵單擊下載文件 - 您可以在上面的示例中看到這一點，右鍵單擊可以選擇“將視頻另存為...”。

但是，我認為您的意思是標准視頻控件中內置的下載按鈕 - 即“播放”、“快進”等按鈕所在的相同位置。

HTML5 規范並未說明必須支持下載控件 - 規范使用的措辭是 ( https://html.spec.whatwg.org/multipage/media.html#the-video-element )：

此用戶界面應包括以下功能：開始播放、暫停播放、在內容中搜索任意 position（如果內容支持任意搜索）、更改音量、更改隱藏式字幕或嵌入式手語軌道的顯示、select 不同的音頻跟蹤或打開音頻描述，並以更適合用戶的方式顯示媒體內容（例如全屏視頻或在獨立的可調整大小的窗口中）。 也可以提供其他控件。

例如，Chrome 提供了您在上面顯示的下載按鈕作為標准控件的一部分，但 Safari 沒有：

假設您希望您的解決方案也可以跨瀏覽器工作，最好的方法可能是自己將自定義控件添加到頁面上的視頻元素，或者使用可以提供您希望的下載功能的第三方播放器。

Mozilla 提供了一個很好的指南（在撰寫本文時）來創建樣式自定義視頻控件，您可以在其中添加自己的下載按鈕：

• https://developer.mozilla.org/en-US/docs/Web/Guide/Audio_and_video_delivery/Video_player_styling_basics

您也可以采用更簡單的方法，只需在頁面上添加帶有視頻元素的下載按鈕，但這並不優雅。

如果您更喜歡使用第三方播放器，則可以使用 video.js 等播放器的插件來添加下載按鈕 - 例如https://github.com/7Ds7/videojs-vjsdownload#readme