https://blog.csdn.net/qq_42076140/article/details/82113622    原文地址

<a href="javascript:download();" >点击下载图片</a>
 //下载图片
function download() {
var imgData = $("#showPayPic").prop('src');//这里放需要下载的base64
downloadFile(new Date().getTime()+".png", imgData);
}
//下载
function downloadFile(fileName, content) {
var aLink = document.createElement('a');
var blob = this.base64ToBlob(content); //new Blob([content]);
var evt = document.createEvent("HTMLEvents");
evt.initEvent("click", true, true);//initEvent 不加后两个参数在FF下会报错 事件类型,是否冒泡,是否阻止浏览器的默认行为
aLink.download = fileName;
aLink.href = URL.createObjectURL(blob);
// aLink.dispatchEvent(evt);
aLink.click()
}
//base64转blob
function base64ToBlob(code) {
var parts = code.split(';base64,');
var contentType = parts[0].split(':')[1];
var raw = window.atob(parts[1]);
var rawLength = raw.length; var uInt8Array = new Uint8Array(rawLength); for (var i = 0; i < rawLength; ++i) {
uInt8Array[i] = raw.charCodeAt(i);
}
return new Blob([uInt8Array], {type: contentType});
}

浏览器下载img标签Base64图片的更多相关文章

  1. java版模拟浏览器下载百度动漫图片到本地。

    package javaNet.Instance.ImageDownload; import java.io.BufferedReader; import java.io.File; import j ...

  2. base64图片在各种浏览器的兼容性处理

    IE浏览器目前最高的版本是v11,而微软放弃了IE,转向新的浏览器开发,并取名为Edge.base64图片在IE9及以后的图片均能显示没有问题,而Firefox, Chrome, Safari等非IE ...

  3. 微信浏览器返回刷新,监听微信浏览器返回事件,网页防复制,移动端禁止图片长按和vivo手机点击img标签放大图片

    以下代码都经过iphone7,华为MT7 ,谷歌浏览器,微信开发者工具,PC端微信验证.如有bug,还请在评论区留言. demo链接:https://pan.baidu.com/s/1c35mbjM ...

  4. Nginx中防盗链(下载防盗链和图片防盗链)操作记录

    日常运维工作中,设置防盗链的需求会经常碰到,这也是优化网站的一个必要措施.今天在此介绍Nginx中设置下载防盗链和图片防盗链的操作~ 一.Nginx中下载防盗链的操作记录对于一些站点上的下载操作,有很 ...

  5. Nginx中防盗链(下载防盗链和图片防盗链)及图片访问地址操作记录

    日常运维工作中,设置防盗链的需求会经常碰到,这也是优化网站的一个必要措施.今天在此介绍Nginx中设置下载防盗链和图片防盗链的操作~ 一.Nginx中下载防盗链的操作记录对于一些站点上的下载操作,有很 ...

  6. Base64图片编码原理,base64图片工具介绍,图片在线转换Base64

    Base64图片编码原理,base64图片工具介绍,图片在线转换Base64 DataURI 允许在HTML文档中嵌入小文件,可以使用 img 标签或 CSS 嵌入转换后的 Base64 编码,减少  ...

  7. Ajax清除浏览器js、css、图片缓存的方法

    做东东时都是把图片在服务器的地址存放在数据库里面,然后到浏览器中显示,但是后来发现了两个问题. 第一:为了安全起见,js是无法读取本地的图片的,不然你写一个js,岂不是可以获取任何人电脑里面的文件了. ...

  8. Base64 图片转换工具

    以前在写asp的后台的时候,有一个上传功能是必须的,那时候进行的图片预览(未上传前)其实就是获取本地的图片路径来显示图片,但是随着HTML5的出现,可以把图片通过编码来实现预览. 在雅虎的36条速度优 ...

  9. [TFRecord格式数据]利用TFRecords存储与读取带标签的图片

    利用TFRecords存储与读取带标签的图片 原创文章,转载请注明出处~ 觉得有用的话,欢迎一起讨论相互学习~Follow Me TFRecords其实是一种二进制文件,虽然它不如其他格式好理解,但是 ...

随机推荐

  1. linux查看系统cpu信息

    # 查看物理CPU个数 cat /proc/cpuinfo| grep "physical id"| sort| uniq| wc -l # 查看每个物理CPU中core的个数(即 ...

  2. PHP SOAP 教程

    一.SoapServer 服务器 1.__construct 作用:创建 SoapServer 对象 用法:__construct ( mixed wsdl [, array options] ) 参 ...

  3. Ubuntu 16.04 Chrome浏览器安装flash player插件

    1:官网下载插件  flash palyer lash_player_npapi_linux_debug.x86_64.tar.gz 2:解压 提取 libpepflashplayer.so 3:手动 ...

  4. eclipse/myeclipse中js/java的自动提示只有4个字符怎么解决

    https://blog.csdn.net/LinBM123/article/details/80450690

  5. 【BZOJ 1179】[Apio2009]Atm

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] tarjan强连通缩点一下. 然后把缩点之后,每个点的钱的数累加起来. 然后从S出发 开始一边做bfs一遍做dp. 最后输出有酒吧的 ...

  6. Mysql学习总结(22)——Mysql数据库中制作千万级测试表

    前言: 为了方便测试性能.分表等工作,就需要先建立一张比较大的数据表.我这里准备先建一张千万记录用户表. 步骤: 1 创建数据表(MYISAM方式存储插入速度比innodb方式快很多) 数据表描述 数 ...

  7. NSURLCache、网络监測状态

    有时候.对同一个URL请求多次.返回的数据可能一样的: 比方server上的某张图片.不管下载多少次,返回的数据都是一样的.可是这些情况会造成下面问题: 1,用户流量的浪费. 2.程序响应速度不够快 ...

  8. mac鼠标滚动方向自然问题

    mac使用鼠标的时候滚轮方向和Windows是相反的.假设不勾选滚动方向自然,那么触摸板使用不爽. 解决的方法: 1.打开http://pilotmoon.com/scrollreverser/,下载 ...

  9. 威胁报告:mDNS 反射式 DDoS 攻击

    威胁报告:mDNS 反射式 DDoS 攻击 转自:https://www.akamai.com/cn/zh/about/our-thinking/threat-advisories/akamai-md ...

  10. rest_framework 视图

    视图: a.过去 class PagerView(View): pass b.现在 class Pager1View(APIView): pass c.rest_framework 基本没用 from ...