Vue中的加密方式(js-base64、crypto-js、jsencrypt、bcryptjs)

 

目录

1.安装js-base64库 

2. 在Vue组件中引入js-base64库

3.使用js-base64库进行加密

4.Vue中其他加密方式 

1.crypto-js

2.jsencrypt

3.bcryptjs


1.安装js-base64库 

npm install js-base64 --save-dev

2. 在Vue组件中引入js-base64

import { Base64 } from 'js-base64';

3.使用js-base64库进行加密

// 加密字符串
const str = 'hello world';
const encodedStr = Base64.encode(str);
console.log(encodedStr); // 输出:aGVsbG8gd29ybGQ=// 解密字符串
const decodedStr = Base64.decode(encodedStr);
console.log(decodedStr); // 输出:hello world

使用Base64.encode()方法对字符串进行加密,并使用Base64.decode()方法对加密后的字符串进行解密。您可以根据需要使用这些方法来加密和解密字符串。请注意,加密后的字符串可能包含特殊字符,需要进行URL编码或Base64编码后才能在URL中传递。 

4.Vue中其他加密方式 

  • crypto-js

    crypto-js是一个JavaScript加密库,支持多种加密算法,包括AES、DES、Triple DES、RC4、SHA-1、SHA-256、MD5等。您可以在Vue项目中使用crypto-js来实现加密和解密。

  • jsencrypt

    jsencrypt是一个JavaScript RSA加密库,支持RSA加密和解密操作。您可以在Vue项目中使用jsencrypt来实现RSA加密和解密。

  • bcryptjs

    bcryptjs是一个JavaScript加密库,支持bcrypt算法。您可以在Vue项目中使用bcryptjs来实现密码加密和验证。

1.crypto-js

// 导入crypto-js库
const CryptoJS = require('crypto-js');// 待加密的数据
const data = 'Hello, world!';// 加密
const encryptedData = CryptoJS.AES.encrypt(data, 'secret key 123').toString();
console.log('加密后的数据:', encryptedData);// 解密
const decryptedData = CryptoJS.AES.decrypt(encryptedData, 'secret key 123').toString(CryptoJS.enc.Utf8);
console.log('解密后的数据:', decryptedData);

2.jsencrypt

// 导入jsencrypt库
const JSEncrypt = require('jsencrypt').default;// 待加密的数据
const data = 'Hello, world!';// 创建公钥和私钥实例
const encryptKey = new JSEncrypt();
const decryptKey = encryptKey.createDecryptionKey();// 设置公钥和私钥(在实际使用中需要使用真实密钥)
encryptKey.setPublicKey('-----BEGIN PUBLIC KEY-----\n' + PUBLIC_KEY + '\n-----END PUBLIC KEY-----');
decryptKey.setPrivateKey('-----BEGIN RSA PRIVATE KEY-----\n' + PRIVATE_KEY + '\n-----END RSA PRIVATE KEY-----');// 加密数据
const encryptedData = encryptKey.encrypt(data);
console.log('加密后的数据:', encryptedData);// 解密数据
const decryptedData = decryptKey.decrypt(encryptedData);
console.log('解密后的数据:', decryptedData);

3.bcryptjs

// 导入bcryptjs库
const bcrypt = require('bcryptjs');
const saltRounds = 10; // 设置盐的迭代次数(建议至少为10)
const password = 'password'; // 待加密的密码
const hashedPassword = bcrypt.hashSync(password, saltRounds); // 加密密码(得到散列密码)
console.log('散列密码:', hashedPassword); // 输出散列密码的哈希值

 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/118986.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Shopee买家通系统全自动化操作简单方便又快速

Shopee买家通系统是一款专门针对虾皮买家号所开发的全自动化操作系统,可以自动注册、自动加购加心愿单、自动下单等。 1、全自动化注册 准备好账号需要的资料后即可运行注册任务,程序运行时可以自动输入手机号、自动接收短信、自动输入账号密码。账号支…

用Visual Studio(VS)开发UNIX/Linux项目

目录 FTP是免不了的 正确设置头文件 组织项目结构 创建何种项目类型 FTP自动上传 大部分具有Windows开发经验的程序员会比较喜欢使用Visual Studio,而大部分Unix/Linux程序员则喜欢使用UltraEdit直接在主机上写代码。 为什么直接在主机上写代码呢,因…

FlutterUnit 周边 | 收录排序算法可视化

theme: cyanosis 1. FlutterUnit 更新:排序算法可视化 排序算法可视化是用视图层表现出算法执行过程中排序的过程,感谢 编程的平行世界 在 《十几种排序算法的可视化效果,快来看看!👀》》 一文中提供的算法支持。我进行…

单目3D目标检测[基于深度辅助篇]

基于深度辅助的方法 1. Pseudo-LiDAR Pseudo-LiDAR from Visual Depth Estimation: Bridging the Gap in 3D Object Detection for Autonomous Driving康奈尔大学https://zhuanlan.zhihu.com/p/52803631 首先利用DRON或PSMNET从单目 (Monocular)或双目 (Stereo)图像获取对应的…

设计院图纸加密防泄密方案——天锐绿盾加密软件@德人合科技

天锐绿盾是一款专业的企业信息化防泄密软件,主要针对文档全生命周期进行加密保护,包括创建、修改、传输、归档、分发、销毁等全过程。它可以加强外发数据及终端离线的管理,对正常授权外带范围内的数据流程进行规范。设计图纸、文档等成果数据…

(免费领源码)java#Springboot#mysql装修选购网站99192-计算机毕业设计项目选题推荐

摘 要 随着科学技术,计算机迅速的发展。在如今的社会中,市场上涌现出越来越多的新型的产品,人们有了不同种类的选择拥有产品的方式,而电子商务就是随着人们的需求和网络的发展涌动出的产物,电子商务网站是建立在企业与…

顺序表的定义与实现(数据结构与算法)

一、顺序表的定义 1. 顺序表的定义 #define MaxSize 10 //定义最大长度 typedef struct{ ElemType data[MaxSize]; //用静态的“数组”存放数据元素int length; //顺序表的当前长度 …

SparkSQL的Shuffle分区设定及异常数据处理API(去重、缺失值处理)

一、Spark SQL的Shuffle分区数目设定 二、异常数据处理API (1)去重方法dropDuplicates (2)删除有缺失值的行方法dropna (3)填充缺失值数据fillna 一、Spark SQL的Shuffle分区数目设定 在允许spark程序时&a…

Python实验项目4 :面对对象程序设计

1:运行下面的程序,回答问题。 (1)说明程序的执行过程; (2)程序运行结果是什么? # (1)说明程序的执行过程; # (2)程序运行…

android开发使用OkHttp自带的WebSocket实现IM功能

一、背景 android app开发经常会有IM需求,很多新手不晓得如何入手,难点在于通讯不中断。其实android发展到今天,很多技术都很完善,有很多类似框架可以实现。例如有:okhttp自带的websocket框架、easysocket等等。本文主…

如何做一个无符号数识别程序

1.状态分析 我们可以把无符号数分为:整数,带小数,带指数部分三种形式。以此构建一个DFA。首先需识别输入是整数还是小数点,若是整数部分输入然后还要再循环识别一次是否有小数点,最后识别是否有指数部分,指…

Spring学习笔记—JDK动态代理

✅作者简介:大家好,我是Leo,热爱Java后端开发者,一个想要与大家共同进步的男人😉😉 🍎个人主页:Leo的博客 💞当前专栏: Spring专栏 ✨特色专栏: M…

Redis -- 基础知识2

1.Redis客户端介绍 1.基础介绍 Redis是一种客户端-服务器结构的程序,通过网络进行互动 客户端的多种形态 1.自带了命令行客户端:redis-cil 2.图形化界面的客户端:依赖windows系统,连接服务器有诸多限制,不建议使用 3.基…

打印机连接网络后怎么安装驱动?

打印机在我们办公和生活中算是比较常见的设备,特别是在上班时需要时常打印各种文件,但是有时电脑上的打印机也会有无法打印的问题,或者新买的打印机需要先安装驱动才能正常打印的。 那么这个时候我们需要先检查电脑上的打印机是否有安装驱动&…

正点原子嵌入式linux驱动开发——异步通知

上一篇笔记中使用阻塞或者非阻塞的方式来读取驱动中按键值都是应用程序主动读取的,对于非阻塞方式来说还需要应用程序通过poll函数不断的轮询。最好的方式就是驱动程序能主动向应用程序发出通知,报告自己可以访问,然后应用程序再从驱动程序中…

LCR 146. 螺旋遍历二维数组

LCR 146. 螺旋遍历二维数组 原题链接:完成情况:解题思路:参考代码: 原题链接: LCR 146. 螺旋遍历二维数组 https://leetcode.cn/problems/shun-shi-zhen-da-yin-ju-zhen-lcof/description/ 完成情况: 解…

【Leetcode】【每日一题】【简单】2520. 统计能整除数字的位数

力扣(LeetCode)官网 - 全球极客挚爱的技术成长平台备战技术面试?力扣提供海量技术面试资源,帮助你高效提升编程技能,轻松拿下世界 IT 名企 Dream Offer。https://leetcode.cn/problems/count-the-digits-that-divide-a…

网络安全保险行业面临的挑战与变革

保险业内大多数资产类别的数据可以追溯到几个世纪以前;然而,网络安全保险业仍处于初级阶段。由于勒索软件攻击、高度复杂的黑客和昂贵的数据泄漏事件不断增加,许多网络安全保险提供商开始感到害怕继续承保更多业务。 保险行业 根据最近的路…

【方法】如何给PDF文件添加“打开密码”?

PDF文件可以在线浏览,但如果想要给文件添加“打开密码”,就需要用到软件工具,下面小编分享两种常用的工具,小伙伴们可以根据需要选择。 工具一:PDF编辑器 PDF阅读器一般是没有设置密码的功能模块,PDF编辑器…

python自动化测试(二):xpath获取元素

目录 前置代码 一、什么是xpath方式 二、通过xpath 单组属性名属性值 的方式进行元素定位 三、通过xpath的多组属性进行元素的定位 四、通过xpath文本值的方式进行元素定位 五、通过模糊的文本值方式进行元素定位 前置代码 # codingutf-8 from selenium import webdrive…