保存base64图片到本地

H5页面与APP端、小程序端有所不同，其没有操作本地文件的权限，因此保存图片功能需要“下载”来支持。

一般我们通过canvas等功能生成的图片都是base64格式的。我们需要
1.将base64解码转换成blob对象
2.将blob对象封装到a标签中置入页面
3.模拟点击这个a标签触发下载请求

实现：

function savePicture(base64) {var arr = base64.split(',');var bytes = atob(arr[1]);let ab = new ArrayBuffer(bytes.length);let ia = new Uint8Array(ab);for (let i = 0; i < bytes.length; i++) {ia[i] = bytes.charCodeAt(i);}var blob = new Blob([ab], { type: 'application/octet-stream' });var url = URL.createObjectURL(blob);var a = document.createElement('a');a.href = url;a.download = new Date().valueOf() + ".png";var e = document.createEvent('MouseEvents');e.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);a.dispatchEvent(e);URL.revokeObjectURL(url);
}

H5页面保存base64图片到本地相关推荐

vue 签署文件两张图合并成一张图 h5页面转换成图片并长按保存在本地
在做让用户在页面签名并把当前页面保存为图片,附上完整代码 (直接复制代码,更改接口地址或删除接口逻辑可直接复用) **准备工作:安装 npm install vue-esign --save 全局 ...
php 网络图片转本地,PHP将Base64图片转换为本地图片并保存
PHP将Base64图片转换为本地图片并保存 /** * [将Base64图片转换为本地图片并保存] * @param [Base64] $base64_image_content [要保存的Base ...
html保存当前页面为图片,将html页面保存成图片,图片写入pdf的实现方法(推荐)
需求是一个导出pdf的功能,多方奔走终于实现了,走了不少弯路,而且怀疑现在这个方法仍是弯的. 有个jsPDF 插件可以在前端直接生成pdf,很简便,但不支持IE. 前端: 首先引入 html2can ...
使用 html2canvas 将页面保存成图片
有时我们需要实现在浏览器端直接对整个或部分页面进行截屏,比如移动端常见的"长按网页保存为图片"功能.这个借助 html2canvas 这个第三方 js 库即可实现,下面通过样例演示 ...
php base64_decode 图片,PHP保存Base64图片base64_decode的问题整理
PHP对Base64的支持非常好,有内置的base64_encode与base64_decode负责图片的Base64编码与解码. 编码上,只要将图片流读取到,而后使用base64_encode进行进 ...
微信小程序保存base64图片和普通图片
保存普通图片 "/images/code.png" "https://baidu.cn/a.png" 注意:首先需要拿到图片信息才可以保存:如果路径是网络路径必 ...
h5页面转png图片_HTML、H5、web转图片image的几种方法总结
在即将跨入到2019年时,我接到了一个需求,我们的APP新增了一个分享功能,这个分享功能需要把嵌入在APP里的H5页面转换成图片分享出去. 我们的实现思路是: 用户点击分享按钮时,调用API,将当前页 ...
php文章远程图片,php保存远程图片到本地 php正则匹配文章中的远程图片地址
在添加文章的时候,很多情况下我们需要处理文章中的远程图片,将其保存到本地,以免别人网站删除后文章里面就无法访问了. 因此我们需要正则匹配文章中的图片地址, 这里我们使用php的正则表达式来实现:$co ...
C# .NET 根据Url链接保存Image图片到本地磁盘
C# .NET 根据Url链接保存Image图片到本地磁盘原文:C# .NET 根据Url链接保存Image图片到本地磁盘根据一个Image的Url链接可以在浏览器中显示一个图片,如果要通过代码将 ...

H5页面保存base64图片到本地

保存base64图片到本地

H5页面保存base64图片到本地相关推荐

最新文章

热门文章