由于交叉起源锚标签下载不起作用

Question

我使用锚标记下载并通过服务器网址我尝试下载媒体文件，它在Chrome中工作得很好（下载文件），但在IE，MS Edge和Firefox中开始播放视频。

这是我的代码：

Private Sub CountFilesButton_Click(sender As Object, e As EventArgs) Handles CountFilesButton.Click
    Try

        For Each item As String In DirListBox.Items
            FilesListBox.Items.AddRange(Directory.GetFiles(item.ToString))
        Next
    Catch ex As Exception
        MessageBox.Show(String.Concat("An error occurred ", ex.Message))
    End Try
End Sub

我尝试通过jquery ajax点击URL，我得到了跨源错误。

<a id="lnkDownloadVid" class="btn-download" href="http://cdn.example.com/Media/ATV521Dec16.mp4" download="">

我也试过这个，但仍然得到了交叉来源错误：

//Create a simple AJAX Request to Google and alert the results
alert("Request Start");
$.ajax({
    crossDomain: true,
    headers: {
        "Content-Disposition": "attachment; filename=http://cdn.example.com/Media/ATV521Dec16.mp4"
    },
    url: "http://cdn.example.com/Media/ATV521Dec16.mp4",
    success: function (data) {
        alert(data);
    },
    error: function () {
        alert("error");
    }
});
alert("Request Ends");

任何可能的解决方案或我错过了什么？我需要不使用服务器端下载，换句话说就是直接通过URL下载。 我点击了按钮我需要下载文件。它在chrome中工作，但在IE和firefox中，当我点击按钮时它开始流式传输。

Answer 1

旧浏览器不支持download属性 - 在这种情况下IE＆lt;边缘

除非您可以更改CDN以提供应用程序/八位字节流的标头，否则我建议：

<a id="lnkDownloadVid" class="btn-download" 
href="http://cdn.example.com/Media/ATV521Dec16.mp4" download=""><span
id="message" style="display:none">
 If this does not download when clicked, use the context menu 
 (normally right click or long click on touch devices) to save
</span>
<script>
$("#lnkDownloadVid").hover(
  function() { $(this).next().show(); },       
  function() { $(this).next().hide(); }
);
</script>