首页 > Web开发 > 详细

js 前端不调接口直接下载图片

时间:2019-06-19 16:21:44      阅读:529      评论:0      收藏:0      [点我收藏+]
// 下载图片 
      downPhoto (path) {
        this.downloadFiles(path)
      },
      // 下载
      downloadFiles (content) {
        console.log(content)
        const downloadElement = document.createElement(‘a‘)  // 创建下载的链接
        let blob = this.base64ToBlob(content) // new Blob([content]);
        const href = window.URL.createObjectURL(blob)
        downloadElement.href = href
        downloadElement.download = ‘参保人相片.jpg‘  // 下载后的文件名
        document.body.appendChild(downloadElement)
        downloadElement.click() // 下载
        document.body.removeChild(downloadElement) // 下载完成 移除 a
        window.URL.revokeObjectURL(href) // 释放blob对象
      },
      // base64转blob
      base64ToBlob(code) {
        let parts = code.split(‘;base64,‘)
        let contentType = parts[0].split(‘:‘)[1]
        let raw = window.atob(parts[1])
        let rawLength = raw.length
        let uInt8Array = new Uint8Array(rawLength)
        for (let i = 0; i < rawLength; ++i) {
          uInt8Array[i] = raw.charCodeAt(i)
        }
        return new Blob([uInt8Array], {type: contentType})
      },
<button  class="cancel-btn cursor" @click="downPhoto(dataDetail.photo64Byte)">下载图片</button>

 

js 前端不调接口直接下载图片

原文:https://www.cnblogs.com/arealy/p/11051721.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!