vue3使用node-rsa报错buffer is not defined

需求背景:由于vue2项目使用node-rsa,另外个项目是vue3开发的,登录需要和vue2项目打通,共用用户表,两个系统注册的用户不用重复注册,只能复用vue2的加密方式。引入相关文件和安装node-rsa就报错buffer is not defined。

问题原因:- node-rsa 依赖 Node 环境的全局对象 Buffer 、 crypto 等。浏览器并没有这些 API。

  • Webpack 5 和 Vite 默认不再自动注入 Node Polyfill,所以在 Vue3(尤其 Vite)里会出现 "buffer is not defined"。

解决办法:npm i -D buffer vite-plugin-node-polyfills,浏览器确实不报错了,本来联调还是可以正常登录,但是发布到测试环境,还是报错无法登录。

最终解决方案:放弃使用node-rsa,在util文件夹下建jsencrypt.js工具,代码如下,公钥私钥自己找。遇到这种类似问题,不要再多花时间了,使用jsencrypt加密不管什么环境都可以正常登录。

javascript 复制代码
import { JSEncrypt } from 'jsencrypt';

// Initialize JSEncrypt
const crypt = new JSEncrypt();

// Set your RSA key pair
const privateKey = `****`;

const publicKey = `***`

// 加密函数
export function encrypt(data) {
  crypt.setPrivateKey(publicKey);
  return crypt.encrypt(data);
}

// 解密函数
export function decrypt(encryptedData) {
  crypt.setPublicKey(privateKey);
  return crypt.decrypt(encryptedData);
}

export default {
  encrypt,
  decrypt,
};

如果对你有帮助,一键三连哈,如有不对之处,请指出哈

相关推荐
爱敲代码的小鱼7 分钟前
AJAX(异步交互的技术来实现从服务端中获取数据):
前端·javascript·ajax
吹牛不交税24 分钟前
admin.net-v2 框架使用笔记-netcore8.0/10.0版
vue.js·.netcore
MZ_ZXD0012 小时前
springboot旅游信息管理系统-计算机毕业设计源码21675
java·c++·vue.js·spring boot·python·django·php
铅笔侠_小龙虾2 小时前
Flutter 实战: 计算器
开发语言·javascript·flutter
大模型玩家七七2 小时前
梯度累积真的省显存吗?它换走的是什么成本
java·javascript·数据库·人工智能·深度学习
2501_944711433 小时前
JS 对象遍历全解析
开发语言·前端·javascript
发现一只大呆瓜3 小时前
虚拟列表:支持“向上加载”的历史消息(Vue 3 & React 双版本)
前端·javascript·面试
阔皮大师4 小时前
INote轻量文本编辑器
java·javascript·python·c#
lbb 小魔仙4 小时前
【HarmonyOS实战】React Native 表单实战:自定义 useReactHookForm 高性能验证
javascript·react native·react.js
_codemonster4 小时前
Vue的三种使用方式对比
前端·javascript·vue.js