使用Javascript下载HTML5 mp4视频

Question

Hi I have video tag of HTML5, I want to give a "Download" button to user, where User can able to click and download that video. I know user can download video by right click on browsers, but i want to give this feature on my button.

I am using simple code

$('submit').click(function() {
    window.location.href = 'myvideo.mp4';
});

but it redirect me to video url not shows download popup that i want.

Thanks

Answer 1

HTML5 browsers now allow you to add the download attribute to <a> tags to achieve this in your DOM. You cannot do this in pure javascript.

Source: https://stackoverflow.com/a/6794432/5203655

If however, you have access to the server response, then in PHP you could do something like

<?php
header('Content-type: application/octet-stream');
readfile('myvideo.mp4');

Answer 2

You can use this:

$('submit').click(function() {
  $('<a/>',{
     "href":"The/video/src/path",
    "download":"video.mp4",
    id:"videoDownloadLink"
  }).appendTo(document.body);
  $('#videoDownloadLink').get(0).click().remove();

});

Answer 3

Based on Meghans answer:

header("Content-disposition: attachment; filename=" . basename($filename) .'"');
header('Content-type: application/octet-stream');
readfile($filename);`

Thanks, @Meghan. I copied and changed your code.