I added that code into my html and in script tag i added:
window.onload = function () {
var xhr = new XMLHttpRequest();
xhr.open('GET', '../filevideo/video.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('Vid');
video.oncanplaythrough = function () {
console.log("Can play through video without stopping");
URL.revokeObjectURL(this.src);
};
video.src = URL.createObjectURL(blob);
video.load();
}
};
xhr.send();
}
I would like to add a video from my video folder in my website project to javascript without adding the source to the video tag. I’m trying to not have the video be available to download in the “save page” feature in the browser but at the same time show in the video player of my html page. With the javascript code i did above it prevented the video to be downloaded to my local host desktop. I’m hoping people have multiple alternative codes in javascript to do this. Thank you to all who read and respond.
1: You can never truly block someone from downloading the video, while still letting them play it. Regardless of how you do it, a webpage loading the video sends all the 0’s and 1’s to the browser to play through the video; so in a way they have to download the video to play it.
2. This sort of obfuscation is better handled at the server side than the client side, if you want to make it non-obvious where the video file resides. PHP, ASP, etc.
3. The video tag will still have a source; it simply should destroy said source on load. See point #2.
Hi m_hutley. Thanks for taking the time to read and reply.
Your right in that i cannot prevent completely the videos being taken. I am aware that their are screen capture programs and video download programs. I recently used this code in asp.net and it worked well. But, because i’m looking to potentially go the linux route instead of windows I’ve been trying to build my options on how to protect my videos on the internet.
I was suggested to utilize tactics such as url rewriting, .htaccess, watermarking the videos but i found the javascript way seems to prevent as least the “save page” feature in browsers to not attain the video which is a huge help for me since the videos are originally created.
I will research more into what you said on the PHP, ASP side. It’s just difficult learning this stuff since I’ve only been taught very little in college.
Hi Noppy. Thanks for your reply and taking the time to read.
You make a great point. I tried implementing that scenario into an html page
since reading this and here’s the difference i noticed. If you put the source
into the video tag of an html page then the video can be accessed. If you
put the source in javascript it’s more difficult. The video tag leaves
a link for the source to be accessed in an alternative tab. Javascript’s
code is just like the rest of the page text and not accessible.
I did try this on local host. This tactic works on some of the major
modern browsers. I’ve never published a site and don’t know how it will
work if i implement it into a DNS. I’m hoping that this will work & is
an alternative to DRM, EME and other alternative ways.
ultimately as @m_hutley says there is nothing you can do to stop someone downloading the video if they want to. As you say though you can make it more difficult.
If you combine what you have done with @m_hutley’s suggestion of creating a new url each time the page is loaded then you will get as close as you can get.
Additionally you could add in code to prevent it being hot linked from another site as at the moment someone could find the url and host it on their own site. If the url changes each time it will prevent this.