canvas转图片

toDataURL()

  1. let dataUrl = canvas.toDataURL('image/png')
  2. // dataUrl为base64格式
  3. // 1、通过img标签进行展示
  4. // 2、利用a标签的download属性创建下载

图片 展示

  1. <img src="dataUrl" />

图片 保存/下载

利用 a 标签 的 download 属性,模拟点击事件

  1. let a = document.createElement('a')
  2. a.href = dataUrl
  3. a.download = '自定义命名'
  4. a.click()

canvas转文件上传

toBlob()

  1. canvas.toBlob(blob => {
  2. let file = new File([blob], '自定义文件名')
  3. let formData = new FormData()
  4. formData.append('file', file)
  5. // 上传服务器....
  6. })