html5保存图片到磁盘,如何使用JavaScript将base64映像保存到用户磁盘？

最新推荐文章于 2024-05-24 11:50:17 发布
最新推荐文章于 2024-05-24 11:50:17 发布
阅读量151 收藏
点赞数
文章标签： html5保存图片到磁盘
博客作者遇到了一个JavaScript相关的技术问题，他们成功地将HTML内容转换为Base64字符串来显示图像，但无法通过JavaScript将这个Base64编码的图像直接保存到用户的本地磁盘。提供的`saveImageAs`函数尝试打开新窗口并执行保存命令，但这在Base64字符串情况下无效。寻求解决方案。
摘要由CSDN通过智能技术生成

我已经使用JavaScript

将源内容从html标记转换为base64String。图像显示清晰。现在，我想使用javascript将该图像保存到用户磁盘。

function saveImageAs () {

var imgOrURL;

embedImage.src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUA" +

"AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO" +

"9TXL0Y4OHwAAAABJRU5ErkJggg==";

imgOrURL = embedImage;

if (typeof imgOrURL == 'object')

imgOrURL = embedImage.src;

window.win = open(imgOrURL);

setTimeout('win.document.execCommand("SaveAs")', 0);

}

save image

当我将图像路径设置为html标签的源代码时，此代码效果很好。但是，当我将source传递为base64String时不起作用。

如何实现我想要的？

王友初
关注
DBMS 数据库管理系统的三级模式架构《ClickHouse 实战：企业级大数据分析引擎》...
AI天才研究院
12-07 9403
引文计算机科学领域的所有问题，都可以通过添加一层中间层来解决。通过在用户和计算机中间添加一层逻辑层(概念模型层)，于是就有了“数据库的三级模式”：数据库在三个级别 (层次)上进行抽象，使用户能够逻辑地、抽象地处理数据，而不必关心数据在计算机中的物理表示和存储。 光剑，2021. 数据库简介当今世界是一个充满着数据的互联网世界，充斥着大量的数据。即这个互联网世界就是数据世界。数据的来源有很多，...
Flutter环境搭建
xiangzhihong8的专栏
07-09 2044
Flutter简介 Flutter 是Google开发的一个移动跨平台（Android 和 iOS）的开发框架，使用的是 Dart 语言。和 React Native 不同的是，Flutter 框架并不是一个严格意义上的原生应用开发框架。Flutter 的目标是用来创建高性能、高稳定性、高帧率、低延迟的 Android 和 iOS 应用。并且开发出来的应用在不同的平台用起来跟原生应用具有一样的体...
base64-to-image:将base64解码为图像并将图像保存到磁盘
05-31
#Description 将 base64 解码为图像并将图像保存到磁盘。 #base64 到图像 安装npm install base64-to-image --save 运行测试npm test 用法 需要 .js 文件中的库var base64ToImage = require('base64-to-image'); 将 base64 字符串更改为图像并将其保存到磁盘 var base64Str = "Add valid base64 str"; var path ='put a valid path where you want to save the image'; var optionalObj = {'fileName': 'imageFileName', 'type':'png'}; base64ToImage(base64Str,path,optionalOb
浏览器 控制台 JavaScript 保存数据到硬盘文件
wuyujin1997的博客
09-01 2578
文章目录写数据到文件 - 方法封装原理解析Demo 写数据到文件 - 方法封装 /** * 保存数据到指定的文件 * 利用 Blob 对象把要下载的数据转换为二进制 * 然后利用<a>的href属性和download属性，click事件，实现数据下载。 * @param {string} filename 要保存的文件名 * @param {string} str 要保存的文本内容 */ function saveStringToFile(filename, str) {
js中将数据存到硬盘_如何在Windows 7中将数据备份到虚拟硬盘
culiyuan8310的博客
09-23 499
js中将数据存到硬盘Having a solid backup plan is a must if you have important data on your PC that you don’t want to lose. Today we take a look at a unique way of using a virtual hard drive in Windows 7 to bac...
使用JavaScript实现保存文件，用户可以自己选择本地路径
m0_53063391的博客
09-28 7672
浏览器的权限是很低的，是不能与操作系统实现交互，只有少量的api可以与操作系统交互，例如文件上传。但是，软件是有很高的权限的，例如，迅雷下载就可以轻松实现，下载到指定目录。// 创建可写入的文件对象。// 打开保存文件对话框。// 在这里写入文件内容。
使用vmware horizon 8进行桌面和应用程序映像管理
# 一、介绍vmware horizon 8 ...- 虚拟桌面管理：可以创建和配置虚拟桌面池，管理和维护桌面映像，并使用vmware horizon 8进行桌面部署和管理。 - 应用程序管理：可以创建和配置应用程序映像，发布和
攻击者如何使用AppleScript攻击macOS?
systemino的博客
04-18 622
当我们考虑macOS的安全性和攻击者使用的工具时，无论这些攻击者是野外攻击还是渗透测试的真实工具，我们都会想到诸如python脚本、shell脚本、恶意文档、可疑扩展之类的东西，当然，还有伪造、篡改或恶意注入程序包。尽管AppleScript内置的macOS技术已经存在了很长时间，并且比macOS 10本身早了8到9年，但在安全领域，人们对它的关注却少得多。 正如我将在以下文章中介绍的那样，...
运维知识点-linux操作系统-linux命令行-BashShell
aming小老弟
11-17 722
Yum（全称为 Yellow dog Updater, Modified）是一个在Fedora和RedHat以及CentOS中的Shell前端软件包管理器。基于RPM包管理，能够从指定的1、显示已经安装的软件包2、查找可以安装的软件包 （以 tomcat 为例）3、安装软件包 （以 tomcat 为例）4、卸载软件包 （以 tomcat 为例）5、列出软件包的依赖 （以 tomcat 为例）6、-y 自动应答yes我们可以用 -y 来应答所有的 yes , 比如我们安装 tomcat 的时候，
js实现打开文件、保存文件和另存
最新发布
qq_30217257的博客
05-24 837
该方法在web端, 首次进入页面需要用户确定给该ip写入权限之后才能进行保存操作,否者无法直接写入客户端电脑磁盘里面。
window.document.execCommand("SaveAs",false,id+".xls"); 在IE7下的问题
落叶飘香
01-02 7895
 我也遇到了这个问题，这好像是微软为了安全性考虑，不能用execcommand函数导出除了txt,htm,html,以外的格式，如果你在上面把xls改成txt，就可以了，导出以后再在系统中改文件后缀名。对了，你上面的代码也有点小问题，实际上你的文件还没导出，就弹了提示成功的对话框，有点问题，呵呵！建议改成：   function               outExcel(atblData)
html+js将文本和图片保存（下载）到本地技术
cnds123的专栏
01-01 1万+
本文介绍html+js将文本和图片保存（下载）到本地技术，先介绍html+js将文本内容保存到本地文件，再介绍html+js将图片内容保存到本地文件。
H5中利用canvas截取裁剪图片并保存为base64
Icebreaker
08-03 1405
<!DOCTYPE html> <html> <head> <title></title> </head> <body> <canvas width="720px" height="1080px" id="canvas"></canvas> <img src="" id="img"> </body> <script type="text/javascript"
js如何实现base64转文件下载保存到本地
weixin_42849516的博客
03-18 6747
//将base64转换为blob dataURLtoBlob(dataurl) { var arr = dataurl.split(","), mime = arr[0].match(/:(.*?);/)[1], bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n); while (n--) { u8arr[n] = bst
小程序 uniapp中webview内嵌H5页面 html2canvas截图 base64的图片保存到手机相册
M__O__M的博客
09-22 6137
H5页面通过html2canvas进行截图，将截图的数据通过wx.miniProgram.navigateTo的地址传值到小程序页面；最后在小程序base64转码保存手机相册。
H5页面保存base64图片到本地
similing的博客
07-01 9686
保存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]); l
原生JS实现base64图片下载-图片保存到本地
热门推荐
weixin_33734785的博客
12-11 1万+
在项目开发过程中，经常会有图片导出的需求。 实现思路：需要创建a标签，然后把base64的图片转为为blob对象，再通过URL.createObjectURL方法复制给a标签的href属性，最后添加添加事件的方法 实现代码： function downloadFile(content, fileName) { //下载base64图片 ...
将图片按base64解码，最后将base64解码后的图片文件保存到本地磁盘。
04-22
# 将图片保存到本地磁盘 image.save("your_image_file_path") ``` 需要将`your_base64_string`替换为您的base64编码字符串，将`your_image_file_path`替换为您想要保存到的文件路径。请注意，如果文件夹不存在，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值