web-dev-qa-db-ja.com

Mp4ダウンロードにより、ブラウザはダウンロードではなくファイルを再生します

私のウェブサイトでは、ユーザーにmp4コンテンツをストリーミングしています。ユーザーによるダウンロードも許可します。ただし、Chromeでは、ファイルをダウンロードするのではなく、内部プレーヤーでファイルを自動的に再生するようです。

代わりにブラウザに強制的にファイルをダウンロードさせるにはどうすればよいですか。

よろしくお願いしますクレイグ

12
Craig Mc

HTTPヘッダー "Content-Disposition"および 'Content-Type:application/force-download'を使用する必要があります。これにより、ブラウザーはコンテンツを表示する代わりに強制的にダウンロードします。そこ。

実装しているサーバー側の言語によって異なります。の場合には

PHP:

    header('Content-Disposition: attachment; filename="'.$nameOfFile.'"');

あなたのために仕事をします。

もちろん、すべてのファイルに対してこれを単純化して一般化するために、ダウンロード可能なコンテンツへのリンクをルーティングするメソッドを記述する必要がある場合があります。

HTMLで表示できるリンクは次のようになります。

<a href="http://yoursite.com/downloadFile?id=1234">Click here to Download Hello.mp4</a>

サーバー側では、/ downloadFile(ルーティングによって異なります)で呼び出されるスクリプトが必要です。IDでファイルを取得し、添付ファイルとしてユーザーに送信します。

<?php

 $fileId = $_POST['id'];

 // so for url http://yoursite.com/downloadFile?id=1234 will download file
 // /pathToVideoFolder/1234.mp4
 $filePath = "/pathToVideoFolder/".$fileId."mp4";
 $fileName = $fileId."mp4"; //or a name from database like getFilenameForID($id)
 //Assume that $filename and $filePath are correclty set.
header('Content-Description: File Transfer');
header('Content-Disposition: attachment; filename="'.$filename.'"');
header('Content-Type: application/force-download');
readfile($filePath);

ここで、「Content-Type:application/force-download」は、MIMEタイプのデフォルト設定が何であっても、ブラウザにダウンロードオプションを強制的に表示します。

サーバー側のテクノロジーが何であれ、注意すべきヘッダーは次のとおりです。

'Content-Description: File Transfer'
'Content-Type: application/force-download'
'Content-Disposition: attachment; filename="myfile.mp4"
12

あなたはmp4への直接のhrefを使用しているように聞こえます。ウェブサイトでサーバー側の言語(例:asp.net、phpなど)の言語を使用している場合は、強制的にダウンロードできます。 aspまたは.netでは、HttpHandlerを「content-disposition」、「attachment; filename = fname.ext」で使用するか、MVCでFile()ActionResultを返すことができます。サーバー側のコードを使用できるかどうか、またコードを提供できるかどうかお知らせください。

または、html5ダウンロード属性を試すこともできます: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a?redirectlocale=en-US&redirectslug=HTML%2FElement%2Fa#attr -ダウンロード

つまり、<a href="http://www.w3schools.com/images/myw3schoolsimage.jpg" download="downloadfilename">

または、javascript/jQueryを試してください。ここにプラグインがあります: http://johnculviner.com/jquery-file-download-plugin-for-ajax-like-feature-rich-file-downloads/

8
johnnyarguelles

Content-Dispositionヘッダーを設定すると修正されます。

Content-Disposition: attachment; filename=whatever.mp4;

サーバー設定またはページの前処理のいずれかで。

1
Matt Rink

いくつかの方法でそれを成し遂げることができます。 IISまたはApache、および使用しているサーバー側の言語を使用しているかどうかはわかりませんが、テクニックはすべて同じです。

IISまたはApacheのMIMEタイプapplication/octect-streamを拡張子.mp4に追加すると、拡張子.mp4のすべてのファイルがダウンロードプロンプトで表示されます。これが最も「ダウンロード」プロンプトを表示する簡単で確実な方法。

以下の例をご覧ください。

http://www.codingstaff.com/learning-center/other/how-to-add-mime-types-to-your-server

上記の例では、video/mp4 fpr .mp4拡張子を設定する代わりに、application/octect-streamに変更します。

また、サーバー側のコード(PHPコード)でも同じことができます。コードはASP.NETでも同様です。「ファイルの強制ダウンロード」はグーグルでお願いします

$file_url = 'http://www.myremoteserver.com/file.mp4';
header('Content-Type: application/octet-stream');
header("Content-Transfer-Encoding: Binary"); 
header("Content-disposition: attachment; filename=\"" . basename($file_url) . "\""); 
readfile($file_url);
0
Aby

クロスブラウザソリューションが必要な場合

ファイルをダウンロードするにはサーバー側のコードが必要です

例:私はjspテクノロジーに取り組んでいます。Webサイトでjspを使用できる場合は、download.jspファイルで次のコードを試すことができます。

<%@ page import="Java.io.*, Java.lang.*, Java.util.*" %>
<%
String filename=request.getParameter("filename");   
response.setContentType("application/octet-stream");
response.setHeader("Content-Disposition",
"attachment;filename="+filename);
 %>

<%
/*
 File file = new File(filepath+filename );*/
 String path = getServletContext().getRealPath("/mp4/"+filename); 
 File file = new File(path);
FileInputStream fileIn = new FileInputStream(file);
ServletOutputStream out1 = response.getOutputStream();

byte[] outputByte = new byte[4096];
//copy binary contect to output stream
while(fileIn.read(outputByte, 0, 4096) != -1)
{
    out1.write(outputByte, 0, 4096);
}
fileIn.close();
out1.flush();
out1.close();
 %>

上記のコードをファイルに入れることができます:download.jsp

次に、ページリンクで次のように使用します。

<a href="download.jsp?filename=song1.mp4">song1</a>

よろしくお願いします

0
Anas2004