Canvas2ImageまたはHTML5のダウンロード属性の代わりにブラウザを使用していますか？

Question

私は与えられた答えが本当にクロスブラウザ、クライアント側ソリューションを提供していない2011年

からthis質問で説明したのと同じ問題に実行していますpattern generatorを開発している間。

輸出パターンボタンをクリックするとき、私は次のソリューションのいずれかを受け入れないだろう：ファイルは.pngの拡張子で保存されていることを保証しながらcanvas2imageを通じてダウンロードをトリガ

1. を（どんなファイル名はCanvas2Image.saveAsPNG()方法から得られる画像に又は、

2. 表示ウィジェット（KendoUI好ましい））に設定し、ユーザが、好ましくは使用していないから、それを保存させています不自由な右クリックソリューションですが、リンクやボタンが付いています。私は現在使用しているボタンの

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  

    } 

ファイルはクロームバージョン23.0でOSXの下で罰金ダウンロードしているようです。 1271.95およびSafariバージョン5.1.7（6534.57.2）。

誰かがOSXのFirefox 17.0.1でダウンロードした後にファイルを開くことができないという報告があります。どうやら、ダウンロードによって.partファイルが生成されます。

最も大きな問題は、ファイル拡張子がないと、この方法が信頼できるものではないことです。

現在のブラウザとの互換性を最大限に引き出すクライアントサイドのソリューションを探しています。そのため、HTML5 download属性は現在Chromeでのみサポートされているため、このトリックは行いません。

どのような創造的な解決策ですか？

Answer 1

同じ問題が発生しました。基本的な問題は、ヘッダーにファイル名を追加する必要がありますが、canvas2imagesはdocument.location.href = strDataを使用し、strDataはヘッダを持たないことです。つまり、canvas2imageは必要な機能をサポートしていないため、別のソリューションを試す必要があります。 2年が経過してきたように（例えば、おそらくFileSaver.jsとキャンバス-toBlob.js）

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