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

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

相关推荐
SuperEugene1 小时前
Vue3 模板语法规范实战:v-if/v-for 不混用 + 表达式精简,避坑指南|Vue 组件与模板规范篇
开发语言·前端·javascript·vue.js·前端框架
Luna-player1 小时前
Vue 3 + Vue Router 的路由配置,简单示例
前端·javascript·vue.js
敲代码的约德尔人1 小时前
JavaScript 设计模式完全指南
javascript·设计模式
angerdream1 小时前
最新版vue3+TypeScript开发入门到实战教程之Vue3详解props
javascript·vue.js
~欲买桂花同载酒~2 小时前
项目优化-vite打包优化
前端·javascript·vue.js
kyriewen2 小时前
JavaScript 继承的七种姿势:从“原型链”到“class”的进化史
前端·javascript·ecmascript 6
wangfpp3 小时前
性能优化,请先停手:为什么我劝你别上来就搞优化?
前端·javascript·面试
踩着两条虫3 小时前
AI 驱动的 Vue3 应用开发平台 深入探究(二十):CLI与工具链之构建配置与Vite集成
前端·vue.js·ai编程
踩着两条虫3 小时前
AI 驱动的 Vue3 应用开发平台 深入探究(二十):CLI与工具链之自定义构建插件
前端·vue.js·ai编程