HTML5 비디오 다운로드 금지(우클릭 저장)
클라이언트가 비디오를 다운로드하지 못하도록 브라우저의 오른쪽 클릭 메뉴에서 "다른 이름으로 비디오 저장..."을 비활성화하려면 어떻게 해야 합니까?
클라이언트가 파일 경로에 직접 액세스할 수 없도록 하는 보다 완벽한 솔루션이 있습니까?
그럴수는 없어요.
이는 브라우저가 콘텐츠를 서비스하도록 설계되었기 때문입니다.하지만 다운로드하는 것을 더 어렵게 만들 수 있습니다.
편리한 '솔루션
유튜브나 Vimeo 같은 서드파티 비디오 사이트에 제 동영상을 올리면 됩니다.뛰어난 비디오 관리 툴을 갖추고 있어 디바이스에 대한 재생을 최적화하고 비디오가 쉽게 리핑되지 않도록 노력하고 있습니다.
회피책 1, "우클릭" 비활성화
이벤트를 비활성화할 수 있습니다. "우클릭"이라고도 합니다.그러면 일반 스키드가 마우스 오른쪽 버튼을 클릭하고 다른 이름으로 저장하여 동영상을 노골적으로 리핑하는 것을 방지할 수 있습니다.그러나 JS를 해제하고 이 문제를 해결하거나 브라우저의 디버거를 통해 비디오 소스를 찾을 수 있습니다.게다가 이 UX는 불량입니다.컨텍스트 메뉴에는 다른 이름으로 저장 외에도 많은 합법적인 항목이 있습니다.
회피책 2, 비디오 플레이어 라이브러리
커스텀 비디오 플레이어 라이브러리를 사용합니다.대부분은 상황에 맞는 메뉴를 커스터마이즈하는 비디오 플레이어를 실장하고 있습니다.따라서 기본 브라우저 컨텍스트 메뉴는 표시되지 않습니다.다른 이름으로 저장과 유사한 메뉴 항목을 제공하는 경우 해당 항목을 비활성화할 수 있습니다.다시 말씀드리지만, 이것은 JS의 회피책입니다.약점은 회피책 1과 비슷합니다.
회피책 3, HTTP 라이브 스트리밍
또 다른 방법은 HTTP Live Streaming을 사용하여 비디오를 처리하는 것입니다.기본적으로는 동영상을 조각으로 잘라 차례로 제공하는 것입니다.이것이 대부분의 스트리밍 사이트가 비디오를 제공하는 방법입니다.따라서 다른 이름으로 저장해도 전체 비디오가 아닌 청크만 저장됩니다.모든 덩어리를 모아서 전용 소프트웨어를 사용하여 꿰매려면 조금 더 많은 노력이 필요합니다.
회피책 4, 캔버스에 그림 그리기
또 다른 기술은 위에 그림을 그리는 것입니다. 이 기술에서는 약간의 자바스크립트를 사용하여 페이지에 표시되는 것은<canvas>의 요소 <video> 이건 '아예'니까<canvas>에서는, 「」, 「」를 사용합니다.<img> ★★★★<video> Save As. 대신 표시됩니다 다른 이름으로 비디오 저장 대신 다른 이름으로 이미지 저장 메시지가 표시됩니다.
회피책 5, CSRF 토큰
CSRF 토큰을 사용할 수도 있습니다.당신의 서버가 페이지에 토큰을 보내도록 할 것이다.그런 다음 이 토큰을 사용하여 비디오를 가져옵니다.서버가 비디오를 제공하기 전에 유효한 토큰인지 확인하거나 HTTP 401을 가져옵니다.비디오 URL을 직접 방문하는 것이 아니라 페이지에서 온 경우에만 얻을 수 있는 토큰을 가지고 있어야만 비디오를 얻을 수 있다는 것입니다.
이는 html5 비디오에서 오른쪽 클릭의 "저장" 옵션을 삭제하고 싶은 사용자를 위한 간단한 솔루션입니다.
$(document).ready(function(){
$('#videoElementID').bind('contextmenu',function() { return false; });
});
네, 이 작업은 다음 3단계로 수행할 수 있습니다.
- 보호할 파일을 코드가 실행 중인 디렉토리의 하위 디렉터리에 배치합니다.
www.foo.com/player.html
www.foo.com/videos/video.mp4 .htaccess라는 이름의 서브디렉토리에 파일을 저장하고 다음 행을 추가합니다.
www.foo.com/videos/.htaccess
#Contents of .htaccess RewriteEngine on RewriteCond %{HTTP_REFERER} !^http://foo.com/.*$ [NC] RewriteCond %{HTTP_REFERER} !^http://www.foo.com/.*$ [NC] RewriteRule .(mp4|mp3|avi)$ - [F]
소스 링크는 사용할 수 없지만 파일을 다운로드하려는 사용자가 파일을 직접 사용할 수 없도록 해야 합니다.
보다 완전한 솔루션을 원하시면 플래시 플레이어(또는 html 캔버스)로 비디오를 제공하고 비디오에 직접 링크하지 마십시오.오른쪽 클릭 메뉴를 삭제하려면 HTML에 추가합니다.
<body oncontextmenu="return false;">
결과:
www.foo.com/player.html 에서는 비디오가 올바르게 재생되지만, www.foo.com/videos/video.mp4 에 액세스 하는 경우는, 다음의 순서에 따릅니다.
Error Code 403: FOBNDED(금지)
이 기능은 직접 다운로드, cURL, 핫링크 등에 사용할 수 있습니다.
이는 두 가지 질문에 대한 완전한 답변이며 "사용자가 이미 다운로드한 비디오를 다운로드하지 못하도록 할 수 있습니까?"라는 질문에 대한 답변이 아닙니다.
간단한 답변입니다.
그럴수는 없어요.
만약 그들이 당신의 비디오를 보고 있다면, 그들은 이미 그것을 가지고 있다.
속도를 늦출 수는 있지만 막을 수는 없습니다.
제가 주로 사용하는 가장 좋은 방법은 매우 간단합니다. 페이지 전체에서 컨텍스트 메뉴를 완전히 비활성화합니다. 순수 html+javascript:
<body oncontextmenu="return false;">
★★★★★★★★★★★★★★★★★★★★★!항상 마우스 오른쪽 버튼으로 소스를 볼 수 있기 때문에 그렇게 합니다.
네, "브라우저 뷰 소스를 직접 사용할 수 있습니다."라고 말합니다.그건 사실이지만 다운로드를 멈출 수 없다는 것부터 시작합니다.html5★★★★★★★★★★★★★★★★★★.
클라이언트 측 개발자로서 BLOB URL을 사용하는 것을 권장합니다.BLOB URL은 바이너리 객체를 참조하는 클라이언트 측 URL입니다.
<video id="id" width="320" height="240" type='video/mp4' controls > </video>
로 남깁니다.src공백, JS에서 AJAX를 사용하여 비디오 파일을 가져오면 응답 유형이 blob인지 확인합니다.
window.onload = function() {
var xhr = new XMLHttpRequest();
xhr.open('GET', 'mov_bbb.mp4', true);
xhr.responseType = 'blob'; //important
xhr.onload = function(e) {
if (this.status == 200) {
console.log("loaded");
var blob = this.response;
var video = document.getElementById('id');
video.oncanplaythrough = function() {
console.log("Can play through video without stopping");
URL.revokeObjectURL(this.src);
};
video.src = URL.createObjectURL(blob);
video.load();
}
};
xhr.send();
}
참고: 이 방법은 대용량 파일에는 권장되지 않습니다.
편집
크로스 오리진 차단 및 헤더 토큰 체크를 사용하여 직접 다운로드를 방지합니다.
동영상이 API를 통해 전달되는 경우 'GET' 대신 다른 http 메서드(PUT/POST)를 사용합니다.
PHP는 html5 비디오 태그를 세션과 함께 전송합니다.여기서 키는 랜덤 문자열이고 값은 파일 이름입니다.
ini_set('session.use_cookies',1);
session_start();
$ogv=uniqid();
$_SESSION[$ogv]='myVideo.ogv';
$webm=uniqid();
$_SESSION[$webm]='myVideo.webm';
echo '<video autoplay="autoplay">'
.'<source src="video.php?video='.$ogv.' type="video/ogg">'
.'<source src="video.php?video='.$webm.' type="video/webm">'
.'</video>';
이제 PHP가 비디오를 전송하도록 요구됩니다.PHP는 파일 이름을 복구하고 세션을 삭제하고 비디오를 즉시 전송합니다.또한 모든 '캐시 없음' 및 MIME 유형 헤더가 존재해야 합니다.
ini_set('session.use_cookies',1);
session_start();
$file='myhiddenvideos/'.$_SESSION[$_GET['video']];
$_SESSION=array();
$params = session_get_cookie_params();
setcookie(session_name(),'', time()-42000,$params["path"],$params["domain"],
$params["secure"], $params["httponly"]);
if(!file_exists($file) or $file==='' or !is_readable($file)){
header('HTTP/1.1 404 File not found',true);
exit;
}
readfile($file);
exit:
이제 사용자가 새 탭에서 URL을 복사하거나 컨텍스트 메뉴를 사용하면 운이 없습니다.
다음과 같이 컨텍스트메뉴를 숨김으로써 이 문제를 쉽게 해결할 수 없습니다.
<video oncontextmenu="return false;" controls>
<source src="https://yoursite.com/yourvideo.mp4" >
</video>
사용할 수 있습니다.
<video src="..." ... controlsList="nodownload">
https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/controlsList
비디오의 저장을 막는 것은 아니지만 컨텍스트 메뉴의 다운로드 버튼과 "다른 이름으로 저장" 옵션을 삭제합니다.
AWS CloudFront는 URL이 만료된 상태로 사용되었습니다.비디오는 로딩되지만 사용자가 오른쪽 버튼을 클릭하여 [Save As]를 선택하면 처음에 수신한 비디오 URL이 만료됩니다.CloudFront Origin Access Identity를 검색합니다.
동영상 URL을 작성하려면 AWS CLI에서 만들 수 있는 키쌍이 필요합니다.참고로 이것은 내 코드가 아니지만 잘 작동합니다!
$resource = 'http://cdn.yourwebsite.com/videos/yourvideourl.mp4';
$timeout = 4;
//This comes from key pair you generated for cloudfront
$keyPairId = "AKAJSDHFKASWERASDF";
$expires = time() + $timeout; //Time out in seconds
$json = '{"Statement":[{"Resource":"'.$resource.'","Condition" {"DateLessThan":{"AWS:EpochTime":'.$expires.'}}}]}';
//Read Cloudfront Private Key Pair
$fp=fopen("/absolute/path/to/your/cloudfront_privatekey.pem","r");
$priv_key=fread($fp,8192);
fclose($fp);
//Create the private key
$key = openssl_get_privatekey($priv_key);
if(!$key)
{
echo "<p>Failed to load private key!</p>";
return;
}
//Sign the policy with the private key
if(!openssl_sign($json, $signed_policy, $key, OPENSSL_ALGO_SHA1))
{
echo '<p>Failed to sign policy: '.openssl_error_string().'</p>';
return;
}
//Create url safe signed policy
$base64_signed_policy = base64_encode($signed_policy);
$signature = str_replace(array('+','=','/'), array('-','_','~'), $base64_signed_policy);
//Construct the URL
$url = $resource.'?Expires='.$expires.'&Signature='.$signature.'&Key-Pair-Id='.$keyPairId;
return '<div class="videowrapper" ><video autoplay controls style="width:100%!important;height:auto!important;"><source src="'.$url.'" type="video/mp4">Your browser does not support the video tag.</video></div>';
적어도 기술에 정통하지 않은 사람들이 마우스 오른쪽 버튼의 상황에 맞는 메뉴를 사용하여 동영상을 다운로드하는 것을 막을 수 있습니다.oncontextmenu Atribute를 사용하면 임의의 요소의 컨텍스트메뉴를 디세블로 할 수 있습니다.
oncontextmenu="return false;"
이 기능은 본문 요소(전체 페이지) 또는 비디오 태그 내에서 사용하는 단일 비디오에 대해서만 작동합니다.
<video oncontextmenu="return false;" controls>...</video>
우선, 비디오의 다운로드를 완전하게 막는 것은 불가능하다는 것을 깨닫고, 당신이 할 수 있는 것은 그것을 더 어렵게 하는 것뿐이다.즉, 비디오의 출처를 숨깁니다.
웹 브라우저는 일시적으로 비디오를 버퍼에 다운로드하기 때문에 다운로드를 방지할 수 있으면 비디오도 볼 수 없게 됩니다.
또, 전 세계 인구의 1% 미만이 소스코드를 이해할 수 있기 때문에, 어느 쪽이든 비교적 안전합니다.그것은 당신이 그것을 소스에도 숨기지 말아야 한다는 것을 의미하지 않는다.-그렇게 해야 한다.
오른쪽 클릭을 비활성화하지 마십시오.게다가 다음과 같은 메시지를 표시해야 합니다."You cannot save this video for copyright reasons. Sorry about that.". 이 답변에 제시된 바와 같이.
이는 사용자에게 매우 성가시고 혼란스러울 수 있습니다.이와는 별도로 브라우저에서 JavaScript를 비활성화하면 마우스 오른쪽 버튼을 클릭하여 저장할 수 있습니다.
사용할 수 있는 CSS 트릭을 다음에 나타냅니다.
video {
pointer-events: none;
}
브라우저에서 CSS를 끌 수 없기 때문에 실제로 오른쪽 클릭을 비활성화하지 않으면 비디오를 보호할 수 없습니다., 는 '이러한 문제라는 입니다.controls도 없습니다.즉, 로 설정할 가 있습니다.false인 Play하거나 Play/Pause API에 를 video이것은 실현 가능한 옵션입니다.
controls다운로드 버튼도 있기 때문에 사용하는 것도 좋지 않습니다.
다음으로 JSFiddle의 예를 나타냅니다.
JavaScript를 사용하여 오른쪽 클릭을 비활성화하려면 비디오 소스도 JavaScript에 저장합니다.이렇게 하면 사용자가 JavaScript(우클릭 허용)를 비활성화하면 비디오가 로드되지 않습니다(비디오 소스를 조금 더 잘 숨길 수도 있습니다).
TxRegex 답변에서:
<video oncontextmenu="return false;" controls>
<source type="video/mp4" id="video">
</video>
이제 JavaScript를 통해 비디오를 추가합니다.
document.getElementById("video").src = "https://www.w3schools.com/html/mov_bbb.mp4";
기능하는 JSFiddle
하는 또 은 우클릭을 하는 입니다.embed그러나 이는 비디오를 실행하기 위한 제어 기능을 제공하지 않으므로 자바스크립트에 삽입해야 합니다.
<embed src="https://www.w3schools.com/html/mov_bbb.mp4"></embed>
100% 보호할 수는 없지만 더 어렵게 만들 수는 있어요제가 설명한 방법들은 MultipleSight와 BestDotNetTraining에서 보호 방법을 공부하는 동안 접하게 되었습니다.그럼에도 불구하고, 이러한 방법들 중 어느 것도 내가 원하는 것을 다운로드하는 것을 막지 못했지만, 나는 그들의 보호를 통과하기 위해 다운로더를 큐레이션하는 데 어려움을 겪었다.
콘텍스트메뉴를 디세블로 하는 다른 방법 외에사용자는 여전히 InternetDownload Manager와 같은 서드파티 도구를 사용하여 비디오를 다운로드할 수 있습니다.여기서 설명하는 보호 방법은 서드파티 소프트웨어를 완화하는 것입니다.
이러한 모든 방법의 요건은, 유저가 비디오를 다운로드하고 있는 것을 특정했을 때에 유저를 차단하는 것입니다.이렇게 하면 웹 사이트에 대한 액세스를 금지하기 전에만 한두 개의 비디오만 다운로드할 수 있습니다.
부인
만약 누군가가 이러한 방법을 남용하거나 다른 사람이나 제가 예로 든 웹사이트를 해치는 데 사용한다면 저는 어떠한 책임도 지지 않습니다.지식 공유를 통해 지적 제품을 보호할 수 있습니다.
기한이 만료되어 링크를 생성하다
이를 위해서는 사용자별로 다운로드 링크를 작성해야 합니다.azure blob 스토리지 또는 amazon s3로 쉽게 처리할 수 있습니다.비디오 길이의 유효기간 타임 스탬프의 2배로 다운로드 링크를 작성할 수 있습니다.비디오 링크와 요청된 시간을 캡처해야 합니다.이것은 다음 방법에서 필요합니다.이 방법의 단점은 사용자가 재생 버튼을 클릭했을 때 다운로드 링크가 생성된다는 것입니다.
재생 버튼 이벤트에서 서버에 요청을 전송하고 링크를 가져와 소스를 업데이트합니다.
비디오 요구 레이트를 조절하다
그런 다음 사용자가 두 번째 비디오를 요구하는 속도를 모니터링합니다.사용자가 다운로드 링크를 너무 빨리 요청하면 바로 차단합니다.이 문턱값을 너무 크게 설정할 수 없습니다.비디오를 참조하거나 대충 훑어보는 사용자를 실수로 차단할 수 있기 때문입니다.
HTTP 범위 활성화
비디오를 재생하려면 videojs와 같은 js 라이브러리를 사용합니다.또한 헤더에 AcceptRange를 반환해야 합니다.Azure blob 스토리지는 이 기능을 즉시 지원합니다.이렇게 하면 브라우저는 비디오 청크를 청크별로 다운로드하기 시작합니다.보통 32바이트 x 32바이트입니다.그러면 Videoj를 듣고timeupdate할 수 , 은 비디오의 비율을 초과할 수 않고 다운로드하고 있는 할 수 있기 에, 할 수 있습니다.비디오를 시청하는 비율은 비디오를 전송한 비율보다 클 수 없습니다.또, 퍼센티지 변경을 받지 않고 비디오 컨텐츠를 전송하고 있는 경우는, 유저를 차단할 수 있습니다.이것은 유저가 확실히 다운로드하고 있기 때문입니다.
사용자가 비디오를 앞으로 또는 뒤로 건너뛸 수 있기 때문에 이 실장은 까다롭기 때문에 실장할 때는 이 점에 주의해 주십시오.
이 Best 이 Best Dotnet Training을 입니다.timeupdate
myPlayer.ready(function () {
//var player = this;
this.src({
type: "video/mp4",
src: videoURL
});
if (videoId) {
myPlayer.play();
this.on('timeupdate', function () {
var currentPercent = parseInt(100 * myPlayer.currentTime() / myPlayer.duration());//calcualte as percentage
if (currentPercent % 5 == 0) {
//send percentage to server
SaveVideoDurationWatched(currentPercent, videoId);
}
});
}
});
nodejnode의 nodejnode의 경우 node #node를 사용할 수 .request된 총 총 .할 수 .이렇게 해서 '어디로 가느냐'고 한 다음에 '어디로 가느냐'를 사용합니다.Thread.Sleep()또는 스레드를 지연시켜 비디오를 정상적으로 시청할 때 대기해야 하는 양을 지연시킵니다.또, sleep전에 유저는 서버에 전화를 걸어 수신율을 갱신할 수 있습니다.따라서 서버는 사용자가 실제로 비디오를 보고 있다고 생각합니다.
계산은 다음과 같습니다.예를 들어 지금까지 1%를 받았다고 계산하면 다운로드 스레드를 sleep 상태로 만들기 위해 대기해야 할 양을 계산할 수 있습니다.이 방법으로는 비디오가 24분일 경우 실제 길이보다 더 빨리 비디오를 다운로드할 수 없습니다.다운로드에 24분 걸립니다.(첫 번째 메서드에 설정한 임계값에 더해)
original video length 24 minute
24 min *60000 = 1,440,000 miliseconds
1,440,000 % 100 = 14,400 milisecond is needed to download one percent
브라우저 에이전트 확인
웹 페이지를 제공하고 비디오 링크를 제공하거나 진행률 업데이트 요청을 수락할 때 브라우저 에이전트를 볼 수 있습니다. 그렇지 않으면 사용자를 금지하십시오.
일부 오래된 브라우저에서는 이 정보가 전달되지 않습니다.따라서 비디오 요청과 웹 페이지 요청 모두에 브라우저 에이전트가 없는 경우 이를 무시해야 합니다. 그러나 한 요청에는 해당 에이전트가 있고 다른 요청에는 없는 경우 사용자를 금지해야 합니다.
사용자는 다운로드 링크를 캡처하기 위해 사용하는 헤드리스브라우저와 동일하게 브라우저 에이전트헤더를 수동으로 설정할 수 있습니다.
참조자 헤더 확인
참조처가 호스트 URL 또는 비디오를 제공하는 페이지 URL 이외의 경우 다운로드 링크가 다른 탭 또는 다른 응용 프로그램에 저장되기 때문에 사용자를 금지할 수 있습니다.진행상황 업데이트 요청에 대해서도 수행할 수 있습니다.
이를 위한 요건은 비디오의 매핑과 해당 비디오를 보여주는 페이지가 있어야 합니다.URL을 이해하기 위한 규칙이나 패턴을 작성할 수 있습니다.설계에 따라 달라집니다.
이 문제를 해결하기 위해 사용자는 비디오를 다운로드 할 때 다운로드 페이지 URL과 동일하게 레퍼러 헤더를 수동으로 설정할 수 있습니다.
요청 간격 계산
요청이 너무 많아서 요청 간의 시간이 같으면 사용자를 차단해야 합니다.비디오 링크 생성 요구 간의 시간을 캡처하기 위해 이 값을 입력해야 합니다.이것들이 동일하고(및 일부 임계값 초과) 여러 번 발생할 경우 사용자를 금지할 수 있습니다.웹 사이트 또는 비디오를 탐색하는 봇이 있는 경우 보통 요청 사이에 동일한 sleep 시간이 있기 때문입니다.예를 들어, 각 요청을 1.3분마다 수신하는 경우(일부 편차를 더하여/분)입니다.알람을 울리는 거죠이 경우 통계 계산을 사용하여 요청 간의 편차를 알 수 있습니다.
이 문제를 회피하기 위해 사용자는 요구 사이에 임의의 sleep 시간을 설정할 수 있습니다.
샘플 코드
MultipleSight-Downloader가 중간에 있습니다.이 레포는 거의 5년 전에 작성되었습니다.공부 목적으로, 개인 용도로만 작성했기 때문에, 지금까지의 레포는 갱신되지 않고, 갱신을 하거나 작업을 용이하게 하지 않습니다.어떻게 할 수 있는지 보여주는 예에 불과합니다.
그
<body oncontextmenu="return false;">
더 이상 작동하지 않습니다.2018년 6월 현재 Chrome과 Opera는 타임라인에 서브메뉴가 있어 사용자가 해당 동영상을 다운로드하기 위해 마우스 오른쪽 버튼을 클릭할 필요가 없습니다.흥미롭게도 Firefox와 Edge에는 이 기능이 없습니다.
in Vimeo: 와:Vimeo > Goto Video > Settings > Privacy > Mark as Secured도메인 포함을 선택합니다.임베드 도메인이 설정되면 지정된 도메인에서 연결하지 않는 한 누구도 비디오를 삽입하거나 브라우저에서 표시할 수 없습니다.따라서 vimeo 플레이어를 iframe에 로드하는 안전한 페이지가 서버에 있는 경우 이동하기가 매우 어렵습니다.
+1 심플하고 크로스 브라우저:css z-index와 불투명도로 비디오에 투과적인 화상을 표시할 수도 있습니다.따라서 컨텍스트 메뉴에서 "비디오 저장" 대신 "다른 이름으로 사진 저장"이 표시됩니다.
제가 한 일은 다음과 같습니다.
function noRightClick() {
alert("You cannot save this video for copyright reasons. Sorry about that.");
} <body oncontextmenu="noRightClick();">
<video>
<source src="http://calumchilds.com/videos/big_buck_bunny.mp4" type="video/mp4">
</video>
</body>다음은 다운로드를 비활성화하는 완전한 솔루션입니다.오른쪽 클릭> 다른 이름으로 저장...컨텍스트 메뉴에서 다음을 수행합니다.
<video oncontextmenu="return false;" controlsList="nodownload">
</video>
간단한 답변: 유튜브처럼 링크를 암호화하고, 어떻게 하는지 유튜브/구글에 물어보는 것 이상입니다. (당신이 바로 요점을 언급하고 싶은 경우를 대비해서)
저는 이것이 youtube가 할 수 있기 때문에 가능한 일이라고 누구에게나 지적하고 싶습니다.다른 웹사이트도 할 수 있고 브라우저에서도 할 수 없다면 마이크로소프트 엣지나 인터넷 익스플로러 같은 몇 개의 브라우저에서 테스트를 해봤기 때문에 비활성화 시킬 수 있는 방법이 있고 사람들이 여전히 말하는 것을 알 수 있기 때문입니다.만약 유튜브가 할 수 있다면, 그들이 어떻게 하는지 볼 수 있는 유일한 방법은 누군가가 내가 지금 하고 있는 유튜브의 대본을 들여다보는 것이기 때문에 나는 답을 찾으려고 노력한다.커스텀 콘텍스트 메뉴인지도 확인했습니다만, 콘텍스트 메뉴가 inspect 엘리먼트를 오버플로하고 있는 것은 아닌 것 같습니다.그것은 끝난 것처럼 보았고, 새로운 클래스는 생성되지 않으며, javascript에서는 inspect 엘리먼트에 실제로 액세스 할 수 없기 때문에 할 수 없습니다.유튜브 동영상을 더블 오른쪽 클릭하면 크롬의 상황별 메뉴가 뜨는 것을 알 수 있습니다.게다가...유튜브가 그 기능을 추가하지 않을 거예요.저는 조사를 하고 있고 유튜브의 출처를 조사하고 있기 때문에, 답을 찾으면 돌아올 것입니다.누군가 못 찾겠다고 하면, 그들은 저처럼 조사를 하지 않았습니다.유튜브 동영상을 다운로드 받는 유일한 방법은 동영상을 다운로드 받는 것이다.
좋아요, 제가 조사를 해봤는데 제이스크립트가 없다는 것만 빼면 비활성화할 수 있어요어떤 브라우저에서도 찾을 수 없을 것 같고, 유튜브 동영상 링크를 열었을 때 따옴표 없이 "blob:https://www.youtube.com/e5c4808e-297e-451f-80da-3e838caa1275"으로 표시되므로 저장할 수 없습니다.php를 알아야 하는데, 더 어렵게 만든 답처럼 유튜브는 암호화하기가 가장 어렵습니다. 당신은 고급 php 프로그래머가 될 필요가 있지만 만약 당신이 그것을 모른다면 당신이 선택한 사람을 다운로드하기 어렵게 만드는 최선의 대답으로 받아들이는 것보다...그러나 만약 당신이 비디오 링크를 헤비 암호화하는 것보다 php를 알고 있다면, 당신의 비디오 링크에서만 읽을 수 있습니다.나는 그들이 그것을 어떻게 하는지 설명할 수 없지만 그들은 했고 방법이 있다.유튜브에서 동영상을 암호화하는 방법은 매우 스마트하기 때문에 유튜브/구글에서 어떻게 암호화하는지 물어보는 것이 아니라 어떻게 암호화하는지 알고 싶다면...비록 당신이 이미 가장 좋은 답을 선택했지만 이것이 당신에게 도움이 되기를 바랍니다.따라서 링크를 암호화하는 것이 단기적으로 가장 좋습니다.
controlsList 다른 JavaScript 함수를 추가하지 않고 전체 화면 다운로드 시작과 같은 작업을 방지합니다.
<video width="400" controlsList="nofullscreen nodownload" controls>
웹 소켓을 통해 비디오를 스트리밍하는 것이 실행 가능한 옵션인 것 같습니다. 프레임을 스트리밍하고 캔버스 등에 그리는 것과 같습니다.
JavaScript를 사용한 웹소켓에서의 비디오 스트리밍
이렇게 하면 클라이언트가 비디오를 입수하는 것이 더 어려워지고 물론 "동영상을 다른 이름으로 저장..."으로 문제를 해결할 수 있습니다." 오른쪽 클릭 컨텍스트메뉴 옵션(오버킬?!)
완전한 솔루션/솔루션을 찾고 계신다면, https://github.com/mediaelement/mediaelement 를 참조해 주세요.
HTML5 비디오 다운로드 금지(우클릭 저장)
<video type="video/mp4" width="330" height="300" controlsList="nodownload" oncontextmenu="return false;" controls></video>
그럴수는 없어요.
예를 들어, 사용자는 화면, 창, 탭을 기록할 수for example desktopCapture, getUserMedia 있는 API를 사용할 수 있습니다.
캔버스에 쓴 다음 모든 덩어리를 연결하여 영상을 얻을 수 있습니다.
그래서 그들이 정말로 원한다면 동영상을 다운로드하는 것을 막을 방법이 없다.
비디오 다운로드 옵션을 비활성화하려면 이 작업을 시도하십시오.
<video src="" controls controlsList="nodownload"></video>
보안 강화를 위해 JavaScript 대신 PHP를 사용하여 비슷한 문제에 대한 좋은 답을 찾았습니다.
웹 페이지에서 URL/test.mp4를 클릭한 것처럼 브라우저의 기본 플레이어를 사용하여 사용자 브라우저에서 test.mp4를 재생하고 싶지만 사용자 또는 소프트웨어에 의해 내부적으로 제공되는 비밀번호가 필요합니다.
여기 그 아이디어의 간단한 밑그림이 있다.시큐어라고 하는 프로그램을 유저가 실행(실행)하는 것입니다.php를 사용하여 test.mp4를 재생합니다.
test.mp4 파일은 "Require all denied"가 포함된 .htaccess가 포함된 하위 디렉토리("secure Subdirectory")에 있습니다.그러면 URL을 통한 직접 액세스가 즉시 차단됩니다.
안전할 때.php가 실행되어 패스워드를 제공하고(또는 사용자에게 패스워드를 문의하고), PHP 명령어를 사용하여 패스워드를 포함한 POST를 실행합니다.
$Hash=base64_encode(hash_hmac("sha256",$Pwd,$Salt,true));
$HashesAreSame=hash_equals($Hash,$GoalHash);
그런 다음 test.mp4를 테스트하고 다음 PHP 코드를 실행하여 test.mp4 파일을 바이트 스트림으로 사용자의 브라우저에 반환합니다.
header("Content-Type: video/mp4");
echo file_get_contents("secureSubdirectory/$path");
exit;
비디오는 예상대로 표시된다.그런 다음 비디오를 보여주는 페이지를 오른쪽 클릭하여 비디오를 저장하려고 하면 test.mp4가 플레인시큐어를 사용하여 쿼리되고 있기 때문에 결과 파일에는 "Error: password not found"와 같은 오류 문자열만 포함됩니다.php URL, 올바른 패스워드로 POST를 사용하지 않습니다.
물론 브라우저 디버깅툴의 [Network]옵션을 사용하여 응답 페이로드(비디오 바이트)를 얻을 수 있지만 브라우저가 디버깅툴에 대한 접근을 막는 옵션을 제공했다면 PHP 프로그램이나 .htaccess 파일에 의해 이를 방지할 수 있습니다.
장애의 경우는 상상할 수 없지만, 심플하지만 완벽한 허가는 매우 드물기 때문에 매우 흥미가 있습니다(이 방법은 패스워드에 의존하기 때문에 사용자가 실수로 또는 의도적으로 패스워드를 공개하거나 공유할 수 있기 때문에 안전한 인증방법은 아닙니다).
@Clayton-Graul은 AngularJs를 사용하는 사이트에는 CoffeeScript 버전이 필요하다는 것 외에는 제가 찾고 있던 것을 가지고 있었습니다.그것도 필요할 때를 대비해서 앵귤러에 이렇게 넣으세요문제의 JS 컨트롤러:
# This is how to we do JQuery ready() dom stuff
$ ->
# let's hide those annoying download video options.
# of course anyone who knows how can still download
# the video, but hey... more power to 'em.
$('#my-video').bind 'contextmenu', ->
false
"원 k에서 이상한 일이 벌어지고 있다" (진짜)
브라우저에 표시되는 모든 내용은 다운로드된 콘텐츠입니다.여기서 언급되는 질문은 해당 콘텐츠를 브라우저에 저장하는 방법입니다.콘텐츠를 보기 위해 클라이언트브라우저는 콘텐츠서버에서 다운로드하여 로컬에서 사용할 수 있도록 합니다.
널리 보급되고 있는 솔루션 중 하나는 콘텐츠를 브라우저에만 저장(에피메랄)하는 것으로, 직접 저장할 수 없는 방식으로 제한된 시간 동안만 저장할 수 있습니다.BLOB는 콘텐츠를 바이너리 오브젝트에 저장하기 때문에 대역폭과 스토리지의 오버헤드를 줄일 수 있는 이점이 있는 구현 중 하나입니다.
콘텐츠의 유효기간이 짧기 때문에 사용자가 만료된 콘텐츠를 저장하기 전에 새로운 콘텐츠가 표시되므로 일반 사용자는 영구 스토리지를 거의 사용할 수 없습니다.
언급URL : https://stackoverflow.com/questions/9756837/prevent-html5-video-from-being-downloaded-right-click-saved
'source' 카테고리의 다른 글
| JavaScript에서 문자열 매칭을 위한 스위치 문 (0) | 2022.12.08 |
|---|---|
| MariaDB 케이스 스테이트먼트 (0) | 2022.12.08 |
| VueJ의 드롭다운 메뉴(액티브 메뉴 검색) (0) | 2022.11.28 |
| MySQL은 단일 쿼리에 여러 인덱스를 사용할 수 있습니까? (0) | 2022.11.28 |
| Javascript에서 개체에서 빈 특성 제거 (0) | 2022.11.28 |