重複の可能性:
その場でキャンバス画像をダウンロード
私は完全に機能しているHTML5canvas
を持っています。今、私は、人々が自分の画像を保存して他の人と共有できる並べ替えゲームを作成したいと考えています. これは、キャンバスがある場所とは異なる URL として画像を保存することで実行できます (推測します)。今、HTML5 キャンバスを「保存」すると、ブラウザに次の URL が表示されます。
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAiYAAAHCCAYAAADb8wJPAAAeKklEQVR4nO3d36tv6V0f8M+fkItceFGKIAiC4EVpwateFQSvAm0g1Is2
だから今、私は本当にそれをサーバーに保存し、友人と共有できるリンクを取得して、インターネット上でこの画像を見ることができるようにしたいと考えています. どうすればこれを可能にできますか?
PS: このスニペットで「保存」します。
<input type="button" id="save" value="Save to PNG">
<script>
document.getElementById('save').onclick = function () {
window.location = document.getElementById("RoCanvas").toDataURL('image/png');
};
</script>