使用Node.js实现base64和png文件相互转换的方法


Posted in Javascript onMarch 11, 2020

前天浏览技术博客,看到大厂面试题型中有使用nodejs实现base64和图片文件相互转换的例子,刚好近期要开发这个功能,暂时记录下来,下周开发完成再做一个补充。

1. 将base64 转换为图片文件,这里举例用的png文件

const fs = require('fs');
const path = 'xxx/'+ Date.now() +'.png';
const base64 = data.replace(/^data:image\/\w+;base64,/,""); //去掉图片base64码前面部分data:image/png;base64
// new Buffer 操作权限太大,v6.0后使用Buffer.from()创建构造函数
const dataBuffer = new Buffer(base64, 'base64'); //把base64码转成buffer对象,
fs.writeFile(path, dataBuffer, function(err){//用fs写入文件
 if(err){
  console.log(err);
 }else{
  console.log('写入成功!');
 }
})

创建Buffer
类型:类整数数组
原因:JavaScript 语言自身只有字符串数据类型,没有二进制数据类型。但在处理像TCP流或文件流时(base64即文件流),必须使用到二进制数据。因此在 Node.js中,定义了一个Buffer类,该类用来创建一个专门存放二进制数据的缓存区。

常用

const buf = Buffer.from(string, encoding); // 返回一个被 string,编码格式是base64(默认编码格式是utf-8)的值初始化的新的 Buffer 实例
buf.toJSON(); // 转换为JSON对象
buf.write(string, offset, length, encoding) // 写入node缓存区
buf.toString(encoding, start, end) // 从缓存区读取数据

2.将图片文件转换成base64

const fs = require("fs");
const util = require("util");
const imageData = await util.promisify(fs.readFileSync(fileUrl)); // 例:xxx/xx/xx.png
const imageBase64 = imageData.toString("base64");
const imagePrefix = "data:image/png;base64,";
console.log(imagePrefix + imageBase64);

知识点补充:NodeJs将任意文件转换为base64格式

很多图片音频等文件,有时候可能需要读取到数据中或者放到单文件的HTML中时,将它们转换成为base64格式是一个好方法,nodejs可以很方便的把文件转换为base64格式:

需要依赖库“fs”,“path”,“mime-types”,库mime-types可通过npm安装,具体的代码如下:

const fs = require('fs');
const path = require('path');
const mineType = require('mime-types');
 
let filePath = path.resolve('your/file/path');
 
let data = fs.readFileSync(filePath);
data = new Buffer(data).toString('base64');
 
let base64 = 'data:' + mineType.lookup(filePath) + ';base64,' + data;
 
fs.writeFileSync(path.resolve('your/save/file/path'), base64);

在你保存的文件中就有该文件的base64格式数据了,实际使用中可以直接使用转换的base64数据,然后可以放到img、audio或者video标签上使用。

总结

到此这篇关于使用Node.js实现base64和png文件相互转换的文章就介绍到这了,更多相关nodejs base64和png转换内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
extjs 的权限问题 要求控制的对象是 菜单,按钮,URL
Mar 09 Javascript
js获取URL的参数的方法(getQueryString)示例
Sep 29 Javascript
JavaScript动态插入script的基本思路及实现函数
Nov 11 Javascript
js取float型小数点后两位数的方法
Jan 18 Javascript
JS实现固定在右下角可展开收缩DIV层的方法
Feb 13 Javascript
Javascript中的几种继承方式对比分析
Mar 22 Javascript
微信小程序 数组(增,删,改,查)等操作实例详解
Jan 05 Javascript
vue源码入口文件分析(推荐)
Jan 30 Javascript
iview中Select 选择器多选校验方法
Mar 15 Javascript
Angular中使用better-scroll插件的方法
Mar 27 Javascript
vuex提交state&&实时监听state数据的改变方法
Sep 16 Javascript
JavaScript实现图片伪异步上传过程解析
Apr 10 Javascript
vue 移动端记录页面浏览位置的方法
Mar 11 #Javascript
Js逆向实现滑动验证码图片还原的示例代码
Mar 10 #Javascript
微信小程序获取公众号文章列表及显示文章的示例代码
Mar 10 #Javascript
jquery实现烟花效果(面向对象)
Mar 10 #jQuery
非常漂亮的js烟花效果
Mar 10 #Javascript
微信小程序搜索框样式并实现跳转到搜索页面(小程序搜索功能)
Mar 10 #Javascript
微信小程序实现搜索功能
Mar 10 #Javascript
You might like
弄了个检测传输的参数是否为数字的Function
2006/12/06 PHP
PHP生成自适应大小的缩略图类及使用方法分享
2014/05/06 PHP
codeigniter中实现一次性加载多个view的方法
2015/03/20 PHP
php简单复制文件的方法
2016/05/09 PHP
Ubuntu server 11.04安装memcache及php使用memcache来存储session的方法
2016/05/31 PHP
PDO的安全处理与事物处理方法
2016/10/31 PHP
php进行md5加密简单实例方法
2019/09/19 PHP
Jquery Select操作方法集合脚本之家特别版
2010/05/17 Javascript
基于JQuery的访问WebService的代码(可访问Java[Xfire])
2010/11/19 Javascript
浅谈Javascript事件处理程序的几种方式
2012/06/27 Javascript
Node.js 条形码识别程序构建思路详解
2016/02/14 Javascript
javascript实现数字倒计时特效
2016/03/30 Javascript
关于session和cookie的简单理解
2016/06/08 Javascript
一个简单的JavaScript Map实例(分享)
2016/08/03 Javascript
浅谈JS中String()与 .toString()的区别
2016/10/20 Javascript
IDEA安装vue插件图文详解
2019/09/26 Javascript
vue基础知识--axios合并请求和slot
2020/06/04 Javascript
基于Element封装一个表格组件tableList的使用方法
2020/06/29 Javascript
浅谈JavaScript节流和防抖函数
2020/08/25 Javascript
解决vant-UI库修改样式无效的问题
2020/11/03 Javascript
[56:18]VGJ.S vs Secret 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
Python ORM框架SQLAlchemy学习笔记之数据添加和事务回滚介绍
2014/06/10 Python
寻找网站后台地址的python脚本
2014/09/01 Python
Python+Turtle动态绘制一棵树实例分享
2018/01/16 Python
python之文件读取一行一行的方法
2018/07/12 Python
python对 MySQL 数据库进行增删改查的脚本
2020/10/22 Python
用gpu训练好的神经网络,用tensorflow-cpu跑出错的原因及解决方案
2021/03/03 Python
美国祛痘、抗衰老药妆品牌:Murad
2016/08/27 全球购物
英国乡村时尚和宠物用品专家:Pet & Country
2018/07/02 全球购物
工作个人的自我评价
2014/01/14 职场文书
电气自动化个人求职信范文
2014/02/03 职场文书
数学与统计学院学生个人职业生涯规划书
2014/02/10 职场文书
雏鹰争章活动总结
2014/05/09 职场文书
2014年个人技术工作总结
2014/12/08 职场文书
签订劳动合同通知书
2015/04/16 职场文书
Python使用pandas导入csv文件内容的示例代码
2022/12/24 Python