js 前端不调接口直接下载图片
// 下载图片
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 前端不调接口直接下载图片的更多相关文章
- js 根据url 下载图片 前端js 实现文件下载
1.H5 download属性 function downFile(content, filename) { // 创建隐藏的可下载链接 var eleLink = document.createEl ...
- 前端下载图片的N种方法
前几天一个简单的下载图片的需求折腾了我后端大佬好几天,最终还是需要前端来搞,开始说不行的笔者最后又行了,所以趁着这个机会来总结一下下载图片到底有多少种方法. 先起个服务 使用expressjs起个简单 ...
- 一个失误导致微信下载图片接口Token失效
公司的应用调了一个微信上传下载图片的接口,本来在线上跑的好好的,什么问题没有,但是这两天总是不定时的出现下载下来的图片损坏,拿着Token和serverid去接口测试网页验证,返回的是Token失效了 ...
- JS前端创建CSV或Excel文件并浏览器导出下载
长期以来,在做文件下载功能的时候都是前端通过ajax把需要生成的文件的内容参数传递给后端,后端通过Java语言将文件生成在服务器,然后返回一个文件下载的连接地址url.前端通过location.hre ...
- 利用Node 搭配uglify-js压缩js文件,批量下载图片到本地
Node的便民技巧-- 压缩代码 下载图片 压缩代码 相信很多前端的同学都会在上线前压缩JS代码,现在的Gulp Webpack Grunt......都能轻松实现.但问题来了,这些都不会,难道就要面 ...
- python聚类算法解决方案(rest接口/mpp数据库/json数据/下载图片及数据)
1. 场景描述 一直做java,因项目原因,需要封装一些经典的算法到平台上去,就一边学习python,一边网上寻找经典算法代码,今天介绍下经典的K-means聚类算法,算法原理就不介绍了,只从代码层面 ...
- vue.js如何根据后台返回来的图片url进行图片下载
最近在做一个前端vue.js对接的功能模块时,需要实现一个下载图片的功能,后台返回来的是一串图片url,试了很多种方法,发现点击下载时出来的效果都是跳着到一个新的图片网页,后来经过一番琢磨,终于解决了 ...
- js 根据url 下载图片
downloadIamge(imgsrc, name) {//下载图片地址和图片名 let image = new Image(); // 解决跨域 Canvas 污染问题 image.setAttr ...
- web前端性能调优
最近2个月一直在做手机端和电视端开发,开发的过程遇到过各种坑.弄到快元旦了,终于把上线了.2个月干下来满满的的辛苦,没有那么忙了自己准备把前端的性能调优总结以下,以方便以后自己再次使用到的时候得于得心 ...
随机推荐
- E20190214-mt
roughly adv. 粗略地; 大致上; 大体上; 粗暴地; equivalent adj. 相等的,相当的,等效的; 等价的,等积的; [化学] 当量的; consult vi. 咨询; 商 ...
- win10+PHP 安装redis
1.给php环境安装redis扩展 2.给电脑安装redis环境 一.为php安装redis服务 使用 phpinfo() 函数查看php对应的版本 二.去下面的两个网站下载对应版本的压缩包并解压(注 ...
- 手游性能优化之深入理解Texture Compression
http://gad.qq.com/article/detail/7154875 一.引子 手游项目开发日常里,经常有美术同学搞不清Photoshop制图软件与Unity3D游戏引擎之间的图片asse ...
- [Xcode 实际操作]八、网络与多线程-(3)使用UIApplication对象拨打电话
目录:[Swift]Xcode实际操作 本文将演示如何使用应用程序单例对象,拨打电话的功能. 在项目导航区,打开视图控制器的代码文件[ViewController.swift] 注:需要使用真机进行测 ...
- spark sql 对接 HDFS
上一篇博客我向大家介绍了如何快速地搭建spark run on standalone,下面我将介绍saprk sql 如何对接 hdfs 我们知道,在spark shell 中操作hdfs 上的数据是 ...
- mvn从下载安装到纯命令行创建第一个mvn程序(编码,编译,测试,安装,打包)全过程细致分解
1.maven的下载和安装: a.maven的下载注意事项:如果你是windows,请选择①号,如果你是linux,请选择②号,下载地址:http://maven.apache.org/downloa ...
- On the way to the park Gym - 101147I 几何
http://codeforces.com/gym/101147/problem/I I. On the way to the park time limit per test 5 seconds m ...
- HDU 3117 Fibonacci Numbers 数学
http://acm.hdu.edu.cn/showproblem.php?pid=3117 fib是有一个数学公式的. 这里的是标准的fib公式 那么fib = 1 / sqrt(5) * ((1 ...
- R 语言中 data table 的相关,内存高效的 增量式 data frame
面对的是这样一个问题,不断读入一行一行数据,append到data frame上,如果用dataframe, rbind() ,可以发现数据大的时候效率明显变低. 原因是 每次bind 都是一次重新 ...
- Coder(线段树)
求一部分和的线段树,因为是对5取余,所以给定一段区间a-b,假设其位置会有变化,最多会有5种和,那么就可以保留这五种和,在用lz进行延迟标记时,保存位置变化了多少也就知道了该从当前和转到哪一个和. 当 ...