基于JS實現(xiàn)頁面視頻video標(biāo)簽禁止下載(下載按鈕+右擊菜單)
更新時間：2024年02月03日 10:00:02 作者：Dreamingnini
最近做項目遇到這樣的需求,禁止用戶瀏覽頁面的時候下載頁面的視頻,網(wǎng)上看到下載視頻的方法有兩種,本文對每種方法做詳細(xì)分析,對js禁止下載視頻相關(guān)知識感興趣的朋友一起看看吧
項目需求：禁止用戶瀏覽頁面的時候下載頁面的視頻
解決：
網(wǎng)頁上下載視頻的方法有兩種
1、視頻自帶的下載按鈕
2、右擊頁面出現(xiàn)菜單中的“另存為”
對于1，因為后臺管理中使用的插件是是百度的Ueditor，所以按照Ueditor的配置修改即可去掉下載按鈕
在ueditor.all.js文件中加入框中代碼
case 'video':
var ext = url.substr(url.lastIndexOf('.') + 1);
if(ext == 'ogv') ext = 'ogg';
str = '<video' + (id ? ' id="' + id + '"' : '') + ' class="' + classname + ' video-js" ' + (align ? ' style="float:' + align + '"': '') +
'controlsList="nodownload" + width="' + width + '" height="' + height + '" src="' + url + '" data-setup="{}">' +
'<source src="' + url + '" type="video/' + ext + '" /></video>';
break;在ueditor.all.min.js文件中加入框中代碼
對于2，采用監(jiān)聽，在mounted中加入代碼，但是該方法會使得整個頁面在右擊的時候都禁止出現(xiàn)菜單，可以按照需求，修改添加的位置，以達(dá)到局部禁止右擊出現(xiàn)菜單的功能
window.addEventListener('contextmenu',function(e){
e.preventDefault();
},false)到此這篇關(guān)于基于JS實現(xiàn)頁面視頻video標(biāo)簽禁止下載(下載按鈕+右擊菜單)的文章就介紹到這了,更多相關(guān)js禁止下載視頻內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要介紹了點(diǎn)評js異步加載的4種方式，幫助大家更全面的了解js異步加載方式，感興趣的小伙伴們可以參考一下2015-12-12
這篇文章主要介紹了JavaScript實現(xiàn)身法證驗證代碼實例,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-08-08
JavaScript實現(xiàn)鼠標(biāo)點(diǎn)擊導(dǎo)航欄變色特效
本文給大家分享一段基于js代碼實現(xiàn)的鼠標(biāo)點(diǎn)擊導(dǎo)航欄變色效果，代碼簡單易懂，非常不錯，具有參考借鑒價值，需要的的朋友參考下2017-02-02
下面小編就為大家?guī)硪黄猨s replace()去除代碼中空格的實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-02-02
這篇文章主要為大家詳細(xì)介紹了JS實現(xiàn)圖片放大鏡插件的使用方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-11-11
xWin之JS版(2-26更新)...2007-01-01
分頁欄是網(wǎng)頁上最常見不過的一個組件，本博文給出分頁欄的一個web2.0標(biāo)準(zhǔn)示例，并作簡要分析2011-11-11
下面小編就為大家?guī)硪黄狫S正則替換掉小括號及內(nèi)容的方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-11-11
JS實現(xiàn)為表格動態(tài)添加標(biāo)題的方法
這篇文章主要介紹了JS實現(xiàn)為表格動態(tài)添加標(biāo)題的方法,涉及javascript中createCaption方法添加標(biāo)題的技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-03-03
javascript實現(xiàn)點(diǎn)亮燈泡特效示例
這篇文章主要介紹了javascript實現(xiàn)點(diǎn)亮燈泡特效示例，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-10-10