Canvas2Image或HTML5下載屬性的跨瀏覽器替代方案？

同時制定了pattern generator我遇到了在this問題描述了同樣的問題，從2011年Canvas2Image或HTML5下載屬性的跨瀏覽器替代方案？

給出的答案真的不提供跨瀏覽器，客戶端解決方案。

點擊出口模式按鈕時，我會接受任何通過以下方法解決：

通過canvas2image觸發下載，同時確保文件保存爲.png擴展名（無論是什麼文件名被設置爲）或，
顯示的窗口小部件（KendoUI優選地）與來自Canvas2Image.saveAsPNG()方法而生成的圖像，並讓用戶從那裏優選不使用將它保存蹩腳的右鍵單擊解決方案，但帶有鏈接或按鈕。

的HTML目前我使用的按鈕：

<button id="downloadbtn" onClick="javascript:downloadImage()" data-role="button" class="k-button">Export Pattern</button>

功能觸發下載：

function downloadImage() { 

    //...extra code omitted 
    var oCanvas = document.getElementById("my_canvas"); 
    oCanvas.width = $("#pixels-h").val(); 
    oCanvas.height = $("#pixels-v").val(); 
    Canvas2Image.saveAsPNG(oCanvas); 
    //...extra code omitted  

    }

文件似乎OSX下下載細跟的Chrome版本23.0。 1271.95和Safari版本5.1.7（6534.57.2）。

我有一個人在Firefox 17.0.1下載OSX時無法打開文件的報告。顯然，下載會生成一個.part文件。

最大的問題是沒有文件擴展名我懷疑這種方法是可靠的。

我在尋找客戶端唯一的解決方案，儘可能與當前瀏覽器兼容，所以我猜HTML5 download屬性不會這樣做，因爲它目前僅在Chrome中受支持。

任何創意解決方案？

來源

2012-12-10 HappyTorso

兩年過去了，我想ping通，如果有對當前的瀏覽器包括iOS版8/OSX沒有更好的辦法？ – andig

我遇到了同樣的問題。基本的問題是文件名需要添加在標題中，但canvas2images使用document.location.href = strData和strData沒有標題。所以答案是，canvas2image不支持我們需要的功能，我們需要嘗試另一種解決方案。（例如可能FileSaver.js和帆布toBlob.js）

http://eligrey.com/demos/FileSaver.js/

來源

2013-12-17 18:44:20

謝謝！ FileSaver看起來非常有前途，儘管在Github上查看受支持的瀏覽器似乎沒有Safari版本支持文件名，這是否意味着Safari上無法實現PNG擴展？ – HappyTorso

我不知道它是否會在Safari上運行，嘗試並找出它並不會造成傷害。 –

@EricHartford它沒有。無論是桌面還是手機，這都非常不幸。我正在考慮擁有FileSaver。js作爲主要解決方案，並且使用API進行備份，它將更改HTTP標頭以觸發下載，或者根據傳遞的base64字符串上載映像，然後使用它的url作爲客戶端響應。 –

Canvas2Image或HTML5下載屬性的跨瀏覽器替代方案？

回答

相關問題