2016-12-08 35 views
0

クロスドメインからファイルをダウンロードしていますが、ChromeとFirefoxの両方で動作しますが、Safariでは動作しません。 Safariが曲を再生している場所でChromeとFirefoxの両方がダウンロードされています。それはサファリバグですが、誰かによって解決され、私はそれをかなり得ていませんでした。私を助けてください。Safariブラウザで強制ダウンロードが機能しない

注:小さなエラーを与える: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; 
} 

サーバサイドコード:

.htaccessファイル

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

答えて

0

問題はサファリのブラウザの互換性ありブロブを効果的に使用するためのブラウザです。だから私は上記のスニペットを削除し、私の操作のために基本アンカータグを使用しました。

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