Question

我从跨域下载文件，并且它在Chrome和Firefox中工作，但不在safari中工作。随着Safari正在播放歌曲，Chrome和Firefox都会下载。这是一个狩猎虫，但有人解决了，我没有得到它。请帮帮我。

注意：发出一个小错误：Failed to load resource: Frame load interrupted

客户代码：

var url = "http://www.example.com/song.mp3";
var xhr = createCORSRequest('GET', url);
  if (!xhr) {
    alert('CORS not supported');
    return;
  }    
    xhr.responseType = 'blob';    
    xhr.onload = function() {
    var a = document.createElement('a');
    a.href = window.URL.createObjectURL(xhr.response);
    a.download = 'FileName.mp3'; 
    a.style.display = 'none';
    document.body.appendChild(a);
    a.click();
    delete a;
  };    
  xhr.onerror = function() {
    alert('Woops, there was an error making the request.');
  };
      xhr.send();
}

function createCORSRequest(method, url) {
  var xhr = new XMLHttpRequest();
  if ("withCredentials" in xhr) {
    // XHR for Chrome/Firefox/Opera/Safari.
    xhr.open(method, url, true);
  } else if (typeof XDomainRequest != "undefined") {
    // XDomainRequest for IE.
    xhr = new XDomainRequest();
    xhr.open(method, url);
  } else {
    // CORS not supported.
    xhr = null;
  }
  return xhr;
}

ServerSide代码：

.htaccess文件

<FilesMatch "\.('mp3')$">
  ForceType application/octet-stream
  Header set Content-Disposition attachment
</FilesMatch>

Answer 1

问题是Safari浏览器在有效使用Blob时的浏览器兼容性。所以我刚删除了上面的代码片段，并使用了基本的锚标记进行操作。

if(navigator.userAgent.indexOf("Safari") != -1){    
         var a = $("<a>").attr("href", url).attr("download", "MyFile.mp3").appendTo("body");
         a[0].click();
         a.remove();    
}

强制下载文件在Safari浏览器中不起作用

1 个答案: