在移动设备和桌面浏览器上实现Web Push通知，需要使用公钥和私钥进行验证和加密。浏览器需要将公钥发送给Push服务。而公钥是使用RSA加密算法生成的。在发送到Push服务之前，需要将公钥编码成与服务器可以理解的格式。目前，Web Push API定义了一种codec信息类型，即使用PubkeyCredentialCreationOptions和PubkeyCredentialRequestOptions对象在JavaScript中指定。在这个对象中，使用了一个名为clientPublicKey的属性，它接受一个ArrayBuffer或Uint8Array类型，它代表公钥。但是，通常情况下，公钥是以字符串的形式存储在服务器上的。因此，在将公钥传输到Push服务之前，需要对其进行编解码。本篇文章将详细介绍在Node.js和浏览器中使用npm包url-base64-to-uint8array对公钥进行编解码的方法。
什么是url-base64-to-uint8array？
url-base64-to-uint8array是一个npm包，它提供了将URL安全的Base64编码字符串转换为ArrayBuffer或Uint8Array的方法。此包是对js-base64-to-arraybuffer包的改进和升级，该包只能转换标准Base64字符串，因此在用于Web Push时需要经过几个额外的步骤才能将其转换为正确的格式。url-base64-to-uint8array包消除了这些附加步骤，实现起来更加简单方便。
安装url-base64-to-uint8array
要使用url-base64-to-uint8array，在Node.js中使用npm安装该包：
npm install url-base64-to-uint8array
在浏览器中，需要使用script标记导入该包：
<script src="url-base64-to-uint8array.min.js"></script>
使用url-base64-to-uint8array
要将URL安全的Base64字符串编码为ArrayBuffer或Uint8Array，只需将字符串作为参数传递给urlBase64ToUint8Array函数即可：
const urlBase64ToUint8Array = require('url-base64-to-uint8array');
const publicKeyString = 'BHsgbtO58N17fHJmdE0F...'; // 公钥的URL安全的Base64编码字符串
const publicKey = urlBase64ToUint8Array(publicKeyString);
// 使用publicKey发送通知如果在浏览器中使用该包，则可以直接调用urlBase64ToUint8Array函数：
const publicKeyString = 'BHsgbtO58N17fHJmdE0F...'; // 公钥的URL安全的Base64编码字符串 const publicKey = urlBase64ToUint8Array(publicKeyString); // 使用publicKey发送通知
示例代码
以下是一个完整示例：
const urlBase64ToUint8Array = require('url-base64-to-uint8array');
const publicKeyString = 'BHsgbtO58N17fHJmdE0F...'; // 公钥的URL安全的Base64编码字符串
const publicKey = urlBase64ToUint8Array(publicKeyString);
// 使用publicKey发送通知本文提供了使用npm包url-base64-to-uint8array对公钥进行编解码的教程。url-base64-to-uint8array是一个方便易用的npm包，它让编解码变得更加简单方便。希望本篇文章能够帮助您更好地理解如何在Node.js和浏览器中使用该包。如果您有任何疑问或需要更多帮助，请随时联系我们。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600553df81e8991b448d12fe