JavaScript

[JavaScript] canvasの画像をBase64形式に変換する

投稿日:2017年11月4日 更新日:

canvasの画像をBase64形式に変換するには、.toDataURL()を使用します。

サンプルソース

例)canvasのデータをjpeg形式としてBase64化する

(inu.png)

(結果例)
data:image/jpeg;base64,/9j/4AAQS...

解説

  • 上記サンプルはローカル環境だと、セキュリティ(クロスドメイン制約)のため実行できません。
    ※Tainted canvases may not be exportedエラーが発生します。
  • 動作確認したい場合は、レンタルサーバ等にアップしてご確認ください。
  • toDataURLの引数には、イメージのタイプを指定します。
    例)"image/png"、"image/jpeg"等。 未指定時は"image/png"とみなされる。

スポンサーリンク

スポンサーリンク

-JavaScript
-,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

[JavaScript] 数値カンマ編集を行うテキストボックス

フォーカスが当たるとカンマ編集を解除し、フォーカスが外れるとカンマ編集を行うテキストボックスのサンプルです。 数値カンマ ...

[JavaScript] replaceAllを実装する

JavaScriptではreplaceメソッドはありますが、replaceAllメソッドはありません。 そこで、repl ...

[JavaScript] 小数点以下指定した桁数で四捨五入する(.toFixed)

小数点以下指定した桁数で四捨五入するには、.toFixed()を使用します。 サンプルソース 例)小数点以下指定した桁で ...

[JavaScript] Javaが使えるかどうか判定する(navigator.javaEnabled())

Javaが使えるかどうか判定するには、navigator.javaEnabled() を使用します。 サンプルソース 例 ...

[JavaScript] テキストを選択した時イベントを取得する(onSelect)

テキストボックスやテキストエリア内の文字を選択したときのイベントを取得するには、onselectを使用します。 サンプル ...

スポンサーリンク