js实现base64编码，前端一般应用场景在与后端接口参数中体现，后端可能需要某个字段是base64编码的字符，这时候就需要用前端的方法进行转换，再作为参数传递到服务端。
js实现base64编码的3种方式
1. 使用base64.js进行转换
获取base64.js，可以直接搜索base64.js下载。推荐使用npm下载：npm install --save js-base64，下载后在node_modules文件夹下面就能找到需要的base64.js。
在普通的html文件中使用：直接将js引入使用<script src="base64.js"></script>。
在vue中使用，用npm下载之后，直接用require引入使用：const Base64 = require('js-base64').Base64。
加密使用：Base64.encode('我是一段需要处理的字符')。
解密使用：Base64.decode('5oiR5piv5LiA5q616ZyA6KaB5aSE55CG55qE5a2X56ym')。
使用示例：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <script src="plugin/base64.js"></script> <script type="text/javascript"> const str = '我是一段需要处理的字符'; console.log(Base64.encode(str)) console.log(Base64.decode('5oiR5piv5LiA5q616ZyA6KaB5aSE55CG55qE5a2X56ym')) </script> </body> </html>
2. js内置方法进行转换
// btoa()：字符串或二进制值转为Base64编码
// atob()：Base64编码转为原来的编码
// 字符串转base64
export function baseToa(str) {
// 对字符串进行编码
var encode = encodeURI(str)
// 对编码的字符串转化base64
var base64 = btoa(encode)
return base64
}
// base64转字符串
export function strTob(base64) {
// 对base64转编码
var decode = atob(base64)
// 编码转字符串
var str = decodeURI(decode)
return str
}
3. node环境内置方法进行转换
node中自带的base64的编码与解码分为三种：普通字符串/十六进制/图片
- 普通字符串
//编码 new Buffer(String).toString('base64'); //解码 new Buffer(base64Str, 'base64').toString();
- 十六进制
//编码 new Buffer(String, 'base64').toString('hex'); //解码 new Buffer(base64Str, 'hex').toString('utf8');
const fs = require('fs'); //编码 function base64_encode(file) { let bitmap = fs.readFileSync(file); return new Buffer(bitmap).toString('base64'); } //解码 function base64_decode(base64str, file) { var bitmap = new Buffer(base64str, 'base64'); fs.writeFileSync(file, bitmap); }
应用场景总结及建议
如果考虑到ie10及其以下低版本兼容性，使用第一种引入base64.js的方式；
如果是移动端项目或不考虑ie低版本兼容，直接使用第二种js内置方法进行转换，简单粗暴；
如果是在node环境中使用，就需要用到第三种方式；
如果是在vue项目中使用，推荐使用第一种，使用npm下载，直接引入使用。
此文章内容来自对以下文章的整合：
base64编码：js实现base64编码的3种方式，多场景下分析使用_js base64_上网的虫不叫网虫的博客-CSDN博客
字符串与base64相互转化_base64转字符串_Jim-zf的博客-CSDN博客
