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

news2024/12/25 14:02:31

 

目录

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.coloradmin.cn/o/1133296.html

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

相关文章

springboot操作nosql的mongodb,或者是如何在mongodb官网创建服务器并进行操作

第一步:在mongodb的官网里面创建云服务器 点进去 这是免费的,由于是一个项目只可以创建一个,这里我已经创建好了 用本地的mongodb服务也是可以的 第二步:点击connect,下载连接mongodb的软件:MongoDBCompass 第三步&am…

钉钉小程序生态6—钉钉OA自定义审批流的创建和使用

文章导航 钉钉小程序生态1—区分企业内部应用、第三方企业应用、第三方个人应用 钉钉小程序生态2—区分小程序和H5微应用 钉钉小程序生态3—钉钉扫码登录PC端网站 钉钉小程序生态4—钉钉小程序三方企业应用事件与回调 钉钉小程序生态5—钉钉群机器人消息通知和钉钉工作通知 钉…

【嵌入式开发学习】__单片机中容易造成内存泄露的几个痛点

目录 前言 一、程序运行 二、什么是内存泄露? 三、内存泄露的严重后果! 四、如何定位到泄露的要点? 五、三大痛点 1. 访问越界 2. 栈 3. 堆 六、泄露常见的场景 1. 重新赋值 2. 首先释放父块 3. 返回值的不正确处理 七、常见的…

无监督学习-K-means

1、 什么是无监督学习 一家广告平台需要根据相似的人口学特征和购买习惯将美国人口分成不同的小组,以便广告客户可以通过有关联的广告接触到他们的目标客户。Airbnb 需要将自己的房屋清单分组成不同的社区,以便用户能更轻松地查阅这些清单。一个数据科学…

账号运营的底层逻辑---获客思维

什么是运营? 运营是做什么的? 什么是内容运营? 什么是活动运营? 一篇带你搞清楚所有的底层逻辑!

三、W5100S/W5500+RP2040树莓派Pico<TCP Client数据回环测试>

文章目录 1. 前言2. 协议简介2.1 简述2.2 优点2.3 应用 3. WIZnet以太网芯片4. TCP Client数据回环测试4.1 程序流程图4.2 测试准备4.3 连接方式4.4 相关代码4.5 测试现象 5. 注意事项6. 相关链接 1. 前言 在当今的计算机网络环境中,TCP(传输控制协议&am…

整理指定文件夹下的所有文件,以类树状图显示并生成对应超链接

最近在整理家里学习资料的时候,由于年代久远,找不到我想要找的文件,windows文件搜索速度感觉太慢。于是想要生成一份类似文件索引的东西来显示所有资料,让我可以快速的找到需要的资料路径 直接上代码 import os import datetim…

基于Java的医院远程预约管理系统设计与实现(源码+lw+部署文档+讲解等)

文章目录 前言具体实现截图论文参考详细视频演示为什么选择我自己的网站自己的小程序(小蔡coding) 代码参考数据库参考源码获取 前言 💗博主介绍:✌全网粉丝10W,CSDN特邀作者、博客专家、CSDN新星计划导师、全栈领域优质创作者&am…

2、Linux权限理解

个人主页:Lei宝啊 愿所有美好如期而遇 目录 前言 Linux权限的概念 1.文件访问者的分(人) 2.文件类型和访问权限(事物属性) 3.文件权限值的表示方法 4.文件访问权限的相关设置方法 file指令 目录的权限 粘滞位 关于权限的总结 前言 在开始Linux权限理…

IDEA: 自用主题及字体搭配推荐

文章目录 1. 字体设置推荐2. 主题推荐3. Rainbow Brackets(彩虹括号)4. 设置背景图片 下面是我的 IDEA 主题和字体,它们的搭配效果如下: 1. 字体设置推荐 在使用 IntelliJ IDEA 进行编码和开发时,一个合适的字体设置可以提高你的工作效率和舒…

Python---for循环中的两大关键字break和continue

之前在while循环中,也是用到两个关键字。 相关链接: 所以,在循环结构中都存在两个关键字:break和continue break:主要功能是终止整个循环 break:代表终止整个循环结构 continue:代表中止当…

【Note】二叉树的遍历

二叉树的遍历 二叉树的基本结构:根节点(Data)、左子树(LChild)和右子树(RChild)。 因此只要依次遍历这三部分,就遍历了整个二叉树。 如果用L、D、R分别表示遍历左子树、访问根结点…

不用编程超简单的自动化测试工具:Airtest入门篇教程!

目录 一、背景 二、什么是Airtest 三、Airtest下载安装 四、Airtest入门使用教程 4.1 连接设备: 4.2 具体测试场景案例: 五、总结 一、背景 很多刚入行或从其他行业转行做测试的同学,日复一日每天做点工已经点得疲惫和麻木&#xff0…

SparkSQL执行流程与Catalyst优化器

目录 一、SparkSQL运行流程与Catalyst优化器 (1)RDD运行流程 (2)SparkSQL自动优化 (3)Catalyst优化器流程 (4)Catalyst优化器总结 (5)Spark SQL执行流程 一、…

Leo赠书活动-02期 【信息科技风险管理:合规管理、技术防控与数字化】

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

五、W5100S/W5500+RP2040树莓派Pico<UDP Client数据回环测试>

文章目录 1. 前言2. 协议简介2.1 简述2.2 优点2.3 应用 3. WIZnet以太网芯片4. UDP Client回环测试4.1 程序流程图4.2 测试准备4.3 连接方式4.4 相关代码4.5 测试现象 5. 注意事项6. 相关链接 1. 前言 UDP是一种无连接的网络协议,它提供了一种简单的、不可靠的方式来…

Premiere Pro(Pr)2023软件下载及安装教程

目录 一.简介 二.安装步骤 软件:Pr版本:2023语言:简体中文大小:8.30G安装环境:Win11/Win10(1809版本以上)硬件要求:CPU2.6GHz 内存8G(或更高,不支持7代以下CPU&#xf…

Android系统启动

首语 Android系统启动与应用启动、四大组件、AMS等很多内容都有关联,因此,Android系统启动是首先需要了解的知识。 Android 系统启动流程 Android系统流程主要部分如上图所示。下面对各个流程进行解析。 Boot ROM 启动电源以及系统启动。当电源按下时…

启动1000万个虚拟线程需要多少时间?需要多少平台线程?

之前,在Java新特性专栏中,我们简单介绍了Java 21正式发布的虚拟线程。 昨天,正好看到一个讲解此内容的视频,非常不错,所以DD这里给大家翻译好了,感兴趣的可以看看。可以进一步了解虚拟线程。 什么是虚拟线…

二进制搭建 Kubernetes+部署网络组件+部署CornDNS+负载均衡部署+部署Dashboard

二进制搭建 Kubernetes v1.20 k8s集群master01:20.0.0.50 kube-apiserver kube-controller-manager kube-scheduler etcd k8s集群master02:20.0.0.100k8s集群node01:20.0.0.110 kubelet kube-proxy docker etcd k8s集群node02:20.…