web-dev-qa-db-ja.com

JavaScriptを使用してHTML5 mp4ビデオをダウンロードする

こんにちは私はHTML5のビデオタグを持っています。ユーザーがそのビデオをクリックしてダウンロードできる「ダウンロード」ボタンをユーザーに与えたいと思います。ユーザーがブラウザを右クリックしてビデオをダウンロードできることはわかっていますが、この機能をボタンに追加したいと思います。

単純なコードを使用しています

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

しかし、それは私をビデオのURLにリダイレクトし、私が望むダウンロードポップアップを表示しません。

ありがとう

javascriptjqueryhtmlvideohtml5-video
7
Rohit

HTML5ブラウザーでは、download属性を<a>タグに追加して、DOMでこれを実現できるようになりました。純粋なJavaScriptではこれを行うことはできません。

ソース： https://stackoverflow.com/a/6794432/5203655

ただし、サーバーの応答にアクセスできる場合は、PHPで次のようにすることができます

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

あなたはこれを使うことができます：

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

});
3
Jai

メガンズの回答に基づく：

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

ありがとう、@ Meghan。コードをコピーして変更しました。

0
Chirag Arora