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,
};

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

相关推荐
掘金安东尼20 分钟前
让 JavaScript 更容易「善后」的新能力
前端·javascript·面试
掘金安东尼22 分钟前
用 HTMX 为 React Data Grid 加速实时更新
前端·javascript·面试
灵感__idea2 小时前
Hello 算法:众里寻她千“百度”
前端·javascript·算法
袋鼠云数栈UED团队4 小时前
基于 Lexical 实现变量输入编辑器
前端·javascript·架构
亦妤4 小时前
JS执行机制、作用域及作用域链
javascript
SuperEugene6 小时前
表单最佳实践:从 v-model 到自定义表单组件(含校验)
前端·javascript·vue.js
不会敲代码16 小时前
React性能优化:深入理解useMemo和useCallback
前端·javascript·react.js
YukiMori238 小时前
一个有趣的原型继承实验:为什么“男人也会生孩子”?从对象赋值到构造函数继承的完整推演
前端·javascript
摸鱼的春哥8 小时前
惊!黑客靠AI把墨西哥政府打穿了,海量数据被黑
前端·javascript·后端
小兵张健8 小时前
Playwright MCP 截图标注方案调研(推荐方案1)
前端·javascript·github