base64图片下载
下面这种写法有些chrome不起作用
downLoadCanvas (data, filename = '活动.png') {
var saveLink = document.createElementNS('http://www.w3.org/1999/xhtml', 'a')
saveLink.href = data
saveLink.download = filename
var event = document.createEvent('MouseEvents')
event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null)
saveLink.dispatchEvent(event)
}
换这种写法之后OK,base64转blob
saveImg () {
html2canvas(this.$refs.imageTofile, {
backgroundColor: null
}).then((canvas) => {
let url = canvas.toDataURL('image/png')
let downloadName = this.detailData.basic.act_name + '.png'
this.downloadFile(downloadName, url)
})
},
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})
},
downloadFile (fileName, content) {
let aLink = document.createElement('a')
let blob = this.base64ToBlob(content) // new Blob([content]);
let evt = document.createEvent('HTMLEvents')
evt.initEvent('click', true, true)// initEvent 不加后两个参数在FF下会报错 事件类型,是否冒泡,是否阻止浏览器的默认行为
aLink.download = fileName
aLink.href = URL.createObjectURL(blob)
aLink.dispatchEvent(new MouseEvent('click', {bubbles: true, cancelable: true, view: window}))// 兼容火狐
},
base64图片下载的更多相关文章
- base64图片内容下载转为图片保存
网页中的base64图片内容下载后,利用PIL转为图片保存 from skimage.io import imread from PIL import Image from cStringIO imp ...
- js实现svg图形转存为图片下载
我们知道canvas画布可以很方便的js原生支持转为图片格式并下载,但是svg矢量图形则并没有这方面原生的支持.研究过HighChart的svg图形的图片下载机制,其实现原理大体是浏览器端收集SVG代 ...
- html转化为图片下载
业务需求:按照客户要求把排课表转化为图片下载到本地.一个月到排课有很多.所以图片会很大 <!DOCTYPE html> <html lang="en"> & ...
- 图片上传前 压缩,base64图片压缩 Exif.js处理ios拍照倒置等问题
曾写过在前端把图片按比例压缩不失真上传服务器的前端和后台,可惜没有及时做总结保留代码,只记得js利用了base64位压缩和Exif.js进行图片处理,还有其中让我头疼的ios拍照上传后会倒置等诸多问题 ...
- js实现svg图形转存为图片下载[转]
我们知道canvas画布可以很方便的js原生支持转为图片格式并下载,但是svg矢量图形则并没有这方面原生的支持.研究过HighChart的svg图形的图片下载机制,其实现原理大体是浏览器端收集SVG代 ...
- svg保存为图片下载到本地
今天给大家说一个将svg下载到本地图片的方法,这里我不得不吐槽一下,为啥博客园不可以直接上传本地文件给大家用来直接下载分享呢,好,吐槽到此为止! 这里需要用到一个js文件,名字自己起,内容如下: (f ...
- 前端js保存页面为图片下载到本地
前端js保存页面为图片下载到本地 手机端点击下载按钮将页面保存成图片到本地 前端js保存页面为图片下载到本地的坑 html2canvas 识别 svg 解决方案 方案 html2canvas.js:可 ...
- 图片下载&&非同源图片下载&&同源下载&&网页点击下载图片
非同源图片下载(html添加canvas标签) 方法1: downloadImgByBase64(url){ console.log() // 创建隐藏的可下载链接 // let blob = ...
- Qt+Python开发百度图片下载器
一.资源下载地址 https://www.aliyundrive.com/s/jBU2wBS8poH 本项目路径:项目->收费->百度图片下载器(可试用5分钟) 安装包直接下载地址:htt ...
随机推荐
- #define学习
C语言中数据有常量和变量,其中定义常量主要有两种方法,这里主要学习#define定义常量的方法. 1.#define定义数字宏常量 例子如下: 1 2 3 4 5 6 7 8 9 10 #includ ...
- (10)C++ 使用类
一.运算符重载 1. #include<iostream> using namespace std; class Sum { int add; public: Sum(int add) { ...
- Django框架(二十七)—— ContentType组件
目录 ContentType组件 一.什么是ContentType组件 二.使用ContentType 三.使用场景总结 ContentType组件 一.什么是ContentType组件 conten ...
- vue自定义指令clickoutside实现点击其他元素才会触发
clickoutside.js // 代码内容 const clickoutsideContext = '@@clickoutsideContext'; export default { bind(e ...
- jsp 内置对象HTTP协议
有些对象不用声明就能够在JSP页面的脚本部分使用,这就是JSP的内置对象. JSP的内置对象有:request .response.session.application.out. 下面我们将一一介绍 ...
- mysql在插入数据前判断是否存在数据
记录一次mysql插入数据的操作,要先判断表中是否存在对应的值. 以往我们的操作都是先select,再insert,今天给大家分享另一种操作,一条sql语句来实现: inset into user(u ...
- Pyhton第八节 字典补充
Python 字典的基本元素是键值对(key-value), 每个键值对的key和value之间用:分割:每个键值对之间用,分割:整个键值对用花括号{}包围 字典内的键(key)必须唯一,值不需要唯一 ...
- 负载均衡实现故障vip自动漂移
环境说明演示vip自动漂移 192.168.237.50 192.168.237.51 vip: 192.168.237.5 keepalived开源软件实现 keepalived可以实现当vip挂的 ...
- EXCEL数据计算不准确的问题
今天,某部门的excel的数值计算,总是出现错误.如下图 ,我们的46那一栏是有前面8*6得出来的,但是结果却显示46,明明应该是48才对,然后再往上追,8是有前面的337-329得出来的,337是有 ...
- Redis ASP.NET 配置链接
对于安装Redis后 很是不明白如何建立Redis 和 .net 的链接配置 于是查找了很多的资料 首先第一步:安装ASP.NET NuGet 包 (ServiceStack.Redis) 安装好后 ...