跳到主要内容

如何使用 javascript 对文字进行 Base64 Encode 编码 和 Decode 解码

· 2 分钟阅读
Eric Cheng

之前的需求要将文字用 Base64 编码和解码，简单的做了些笔记

浏览器原生支援​

浏览器原生提供两个 JavaScript 函数来解码和编码 Base64 文字

btoa (binary to ASCII)：将二进制数据字符串转换为Base64编码的ASCII字符串 atob (ASCII to binary)：解码Base64编码的字符串

测试了一下

let txt = "havocFuture";
let en = window.btoa(txt);
console.log(en);    // aGF2b2NGdXR1cmU=
let de = window.atob(en);
console.log(de);    // havocFuture

看起来是没有问题，编码后格式是正确的，也可以成功的解码

但是把要编码的文字改成中文字重新执行就会出现错误讯息如下

Uncaught DOMException: Failed to execute 'btoa' on 'Window': The string to be encoded contains characters outside of the Latin1 range.

google 了一下，似乎这个 function 并不支援 UTF-8 文字的编码

第三方 Lib 套件：js-base64​

找到一个第三方 Lib 套件

Github：https://github.com/dankogai/js-base64

如果使用的是 npm 的话，先需要 install

$ npm install js-base64

使用上很简单，直接写程式码

import { Base64 } from 'js-base64';

let txt = "老哈的隨手技術筆記";
let en = Base64.encode(txt);
console.log(en);    // 6ICB5ZOI55qE6Zqo5omL5oqA6KGT562G6KiY 
let de = Base64.decode(en);
console.log(de);    // 老哈的隨手技術筆記

测试刚才用 btoa / atob 会报错的中文文字，改用 js-base64 就可以顺利编码和解码了

实作 Base64 Encode 编码 和 Decode 解码​

就直接实作了两个页面

Base64 Encode(编码)
Base64 Decode(解码)

欢迎使用及分享… XD

版权声明

，转载请注明出处
本文键接: https://tech.havocfuture.tw/zh-hans/blog/js-base64-encode-decode



這是 google 廣告