Post

자바스크립트: 캔버스를 이미지 파일로 다운로드

<a> 요소를 만들어서 클릭 이벤트를 트리거시켜 다운로드 하는 방식입니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var canvas = document.getElementById("somewhere")

canvas.toBlob(function(blob) {
  var a = document.createElement("a")
  document.body.appendChild(a)
  a.style = "display: none"
  blob.type = "octet-stream"
        	  
  var url = URL.createObjectURL(blob)
  a.href = url
  a.download = "filename"
  a.click()
  window.URL.revokeObjectURL(url)
}

This post is licensed under CC BY 4.0 by the author.