0

I'm trying to add a video to an html page without adding a source through the video tag.

I've created a .txt file with the html & javascript code.

I've added to the .txt file this code into the video tag:

video id="Vid" controls="controls"  style="width: 100%; height: 80%; border: thick groove #FF0000" oncontextmenu="return false"

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.

Louis
  • 1
  • You are better off adding a watermark and hiring a legal team. If you are displaying it to the user they can copy it in a variety of ways. – James Coyle Feb 18 '19 at 09:25
  • true, when it's on the web it can be downloaded in many ways provide a copy right notice. if you don't want the download button to show up you can do something like this: – Navid Yousefzai Feb 18 '19 at 09:25
  • I did think of doing watermark on the videos James Coyle. It's just since i learned how to prevent downloading from that javascript code of my videos I've tried to use that method so i can give viewers the best user experience. I can't afford DRM & EME tech so i've turned to that. I know that their are screen record programs & video download programs and extensions but the javascript seems to be the most affordable way since in the source code people can't get the video link and when i use the save page feature in the browser the video is not collected. Thanks for your reply. – Louis Feb 18 '19 at 10:20
  • Navid Yousefzai. Thanks for reading and your reply. I tried adding the code you used to the video tag. "controlsList="nodownload". Unfortunately, it didn't work and when i used the source tag in the html file the video can be visible but the "Save Page" feature in the browser can still get the video. – Louis Feb 18 '19 at 10:24
  • even if you try to hide the original javascript to load the file, the request (including the URL) will show in the network view of devtools. take a look at https://stackoverflow.com/questions/10236717/how-to-prevent-a-file-from-direct-url-access for a way to play the video but block simple download requests – Offbeatmammal Feb 18 '19 at 20:44
  • Hello @Offbeatmammal thank you for your response. Your link assisted me greatly. What i was able to do was download an apache server program called XAMPP that assits a user use a .htaccess to enter code to prevent authorization of downloading images & videos in the local host. It worked but for some reason at times when i refresh the page the images pops up in the browser features page source, inspector & developer tools. I'm curious if you've experienced this while uploading to the server and is there a way to prevent access in the browser developer tools? – Louis Mar 04 '19 at 04:34
  • @Louis, short of commercial DRM solutions you're going to find a bunch of loopholes like that ... if it's visible in the browser without DRM it can probably be accesses somehow... – Offbeatmammal Mar 04 '19 at 07:56

0 Answers0