【前后端接口AES+RSA混合加解密详解(vue+SpringBoot)附完整源码】

前后端接口AES+RSA混合加解密详解(vue+SpringBoot)

  • 前后端接口AES+RSA混合加解密
    • 一、AES加密原理和为什么不使用AES加密
    • 二、RSA加密原理和为什么不使用rsa加密
    • 三、AES和RSA混合加密的原理
    • 四、代码样例
      • 前端
        • 1. 请求增加加密标识
        • 2. 前端加密工具类
        • 3.前端axios请求统一封装,和返回统一封装
      • 后端
        • 1.后端加密工具类
        • 2. 请求的返回实体封装
        • 3. 配置过滤器对请求进行加解密操作
        • 4.过滤器注册
        • 5. 获取RSA公钥接口
    • 总结:

前后端接口AES+RSA混合加解密

     为什么需要对前后端接口加解密?主要是甲方要求。

一、AES加密原理和为什么不使用AES加密

  AES是最常见的对称加密算法,加密和解密用到的密钥是相同的,这种加密方式加密速度非常快,适合经常发送数据的场合,且加密长文本比较方便。缺点是密钥的传输比较麻烦,只能将一把公钥分别在前后端代码中各存放一份,还有一个遇到的问题下面会讲到,那就是美国对AES加密密钥长度的限制。优点是加密效率高,缺点是安全性低。

二、RSA加密原理和为什么不使用rsa加密

RSA也就是非对称加密算法,是使用不同密钥进行加密和解密的算法,也称为公私钥加密。公钥和私钥是同时生成的,公钥用来加密,私钥用来解密,加解密的密钥是成对出现。但是不推荐用RSA加密请求报文,因为RSA加密后的报文会很长,经常会出现超过请求体长度限制。优点是安全性高,缺点是RSA的加密效率低。

三、AES和RSA混合加密的原理

我们可以结合两者的优点,AES的加密效率高,那我们可以使用aes来加密报文,而RSA的灵活性和安全性来加密aes的密钥。总的思路就是利用RSA来加密传输AES的密钥,用 AES的密钥来加密请求报文。

四、代码样例

前端

1. 请求增加加密标识
  首先这个功能我们的出发点是可以灵活配置,所以我们在需要加密的请求头添加一个加密标识代码如下:
import axios from '@common/plugins/Axios'saveStudent: data => {return axios.request({url: `/demo/saveStudent`,method: 'post',headers: {//需要加密的请求在头部塞入标识isEncrypt: 1},data})}
2. 前端加密工具类

import JSEncrypt from 'jsencrypt'
import CryptoJS from 'crypto-js'//
// 加密
export function rsaEncrypt(Str, afterPublicKey) {const encryptor = new JSEncrypt()encryptor.setPublicKey(afterPublicKey) // 设置公钥return encryptor.encrypt(Str) // 对数据进行加密
}// 解密
export function rsaDecrypt(Str, frontPrivateKey) {const encryptor = new JSEncrypt()encryptor.setPrivateKey(frontPrivateKey) // 设置私钥return encryptor.decrypt(Str) // 对数据进行解密
}export function aesEncrypt(aeskey, Str) {// 设置一个默认值,如果第二个参数为空采用默认值,不为空则采用新设置的密钥var key = CryptoJS.enc.Utf8.parse(aeskey)var srcs = CryptoJS.enc.Utf8.parse(Str)var encrypted = CryptoJS.AES.encrypt(srcs, key, {// 切记   需要和后端算法模式一致mode: CryptoJS.mode.ECB,padding: CryptoJS.pad.Pkcs7})return encrypted.toString()
}export function aesDecrypt(aeskey, Str) {var key = CryptoJS.enc.Utf8.parse(aeskey)var decrypt = CryptoJS.AES.decrypt(Str, key, {// 切记   需要和后端算法模式一致mode: CryptoJS.mode.ECB,padding: CryptoJS.pad.Pkcs7})return CryptoJS.enc.Utf8.stringify(decrypt).toString()
}
/*** 获取16位随机码AES* @returns {string}*/
export function get16RandomNum() {var chars = [       '0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F','G','H','I','J','K', 'L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z','a','b','c','d','e','f',
'g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z']var nums = ''//这个地方切记要选择16位,因为美国对密钥长度有限制,选择32位的话加解密会报错,需要根据jdk版本去修改相关jar包,有点恼火,选择16位就不用处理。for (var i = 0; i < 16; i++) {var id = parseInt(Math.random() * 61)nums += chars[id]}return nums
}
//获取rsa密钥对
export function getRsaKeys() {return new Promise((resolve, reject) => {window.crypto.subtle.generateKey({name: 'RSA-OAEP',modulusLength: 2048, //can be 1024, 2048, or 4096publicExponent: new Uint8Array([0x01, 0x00, 0x01]),hash: { name: 'SHA-512' } //can be "SHA-1", "SHA-256", "SHA-384", or "SHA-512"},true, //whether the key is extractable (i.e. can be used in exportKey)['encrypt', 'decrypt'] //must be ["encrypt", "decrypt"] or ["wrapKey", "unwrapKey"]).then(function(key) {window.crypto.subtle.exportKey('pkcs8', key.privateKey).then(function(keydata1) {window.crypto.subtle.exportKey('spki', key.publicKey).then(function(keydata2) {var privateKey = RSA2text(keydata1, 1)var publicKey = RSA2text(keydata2)resolve({ privateKey, publicKey })}).catch(function(err) {reject(err)})}).catch(function(err) {reject(err)})}).catch(function(err) {reject(err)})})
}
function RSA2text(buffer, isPrivate = 0) {var binary = ''var bytes = new Uint8Array(buffer)var len = bytes.byteLengthfor (var i = 0; i < len; i++) {binary += String.fromCharCode(bytes[i])}var base64 = window.btoa(binary)let text = base64.replace(/[^\x00-\xff]/g, '$&\x01').replace(/.{64}\x01?/g, '$&\n')return text
}
3.前端axios请求统一封装,和返回统一封装
import Axios from 'axios'
import { getRsaKeys, rsaEncrypt, rsaDecrypt, aesDecrypt, aesEncrypt, get32RandomNum } from '@common/util'
/*** axios实例* @type {AxiosInstance}*/
const instance = Axios.create({headers: {x_requested_with: 'XMLHttpRequest'}
})
let frontPrivateKey
/*** axios请求过滤器*/
instance.interceptors.request.use(async config => {if (sessionStorage.getItem('X-Access-Token')) {// 判断是否存在token,如果存在的话,则每个http header都加上tokenconfig.headers['X-Access-Token'] = sessionStorage.getItem('X-Access-Token')}if (config.headers['isEncrypt']) {config.headers['Content-Type'] = 'application/json;charset=utf-8'if (config.method === 'post' || config.method === 'put') {const { privateKey, publicKey } = await getRsaKeys()let afterPublicKey = sessionStorage.getItem('afterPublicKey')frontPrivateKey = privateKey//每次请求生成aeskeylet aesKey = get16RandomNum()//用登陆后后端生成并返回给前端的的RSA密钥对的公钥将AES16位密钥进行加密let aesKeyByRsa = rsaEncrypt(aesKey, afterPublicKey)//使用AES16位的密钥将请求报文加密(使用的是加密前的aes密钥)if (config.data) {let data = aesEncrypt(aesKey, JSON.stringify(config.data))config.data = {data: data,aeskey: aesKeyByRsa,frontPublicKey: publicKey}}if (config.params) {let data = aesEncrypt(aesKey, JSON.stringify(config.params))config.params = {params: data,aeskey: aesKeyByRsa,frontPublicKey: publicKey}}}}config.url ="你的后端接口请求地址" + config.urlreturn config},err => {return Promise.reject(err)}
)
/*** axios响应过滤器*/
instance.interceptors.response.use(response => {//后端返回的通过rsa加密后的aes密钥let aesKeyByRsa = response.data.aesKeyByRsaif (aesKeyByRsa) {//通过rsa的私钥对后端返回的加密的aeskey进行解密let aesKey = rsaDecrypt(aesKeyByRsa, frontPrivateKey)//使用解密后的aeskey对加密的返回报文进行解密response.data.data = JSON.parse(JSON.parse(aesDecrypt(aesKey, response.data.data)))return response.data}else{ return response}      }},error => {if (error.response.status === 500) {const { data } = erro

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

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

相关文章

Unity3d Shader篇(五)— Phong片元高光反射着色器

文章目录 前言一、Phong片元高光反射着色器是什么&#xff1f;1. Phong片元高光反射着色器的工作原理2. Phong片元高光反射着色器的优缺点优点缺点 二、使用步骤1. Shader 属性定义2. SubShader 设置3. 渲染 Pass4. 定义结构体和顶点着色器函数5. 片元着色器函数 三、效果四、总…

ChatGPT升级版本GPT-4V(ision)支持多模态语音和图像

ChatGPT升级指南&#xff1a;迎接GPT-4V(ision)的全新多模态时代 ChatGPT最新升级引入了GPT-4V(ision)&#xff0c;这是一个突破性的多模态版本&#xff0c;支持语音和图像输入。现在&#xff0c;用户可以与ChatGPT进行更加丰富和互动的对话。以下是您升级到GPT-4V(ision)所需…

机器学习7-K-近邻算法(K-NN)

K-Nearest Neighbors&#xff08;K-近邻算法&#xff0c;简称KNN&#xff09;是一种基本的监督学习算法&#xff0c;用于解决分类和回归问题。KNN的核心思想是基于距离度量&#xff0c;在特征空间中找到最近的K个样本&#xff0c;然后使用它们的标签进行决策。以下是KNN的基本概…

SpringBoot WebSocket客户端与服务端一对一收发信息

依赖 <!--websocket--><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-websocket</artifactId></dependency>配置类 Configuration public class WebSocketConfig {Bean //方法返回值交…

微软.NET6开发的C#特性——委托和事件

我是荔园微风&#xff0c;作为一名在IT界整整25年的老兵&#xff0c;看到不少初学者在学习编程语言的过程中如此的痛苦&#xff0c;我决定做点什么&#xff0c;下面我就重点讲讲微软.NET6开发人员需要知道的C#特性&#xff0c;然后比较其他各种语言进行认识。 C#经历了多年发展…

【Spring源码解读!底层原理进阶】【上】探寻Spring内部:BeanFactory和ApplicationContext实现原理揭秘✨

&#x1f389;&#x1f389;欢迎光临&#x1f389;&#x1f389; &#x1f3c5;我是苏泽&#xff0c;一位对技术充满热情的探索者和分享者。&#x1f680;&#x1f680; &#x1f31f;特别推荐给大家我的最新专栏《Spring 狂野之旅&#xff1a;底层原理高级进阶》 &#x1f680…

Docker部署前端项目

某次阿里云的自动流水线失败了&#xff0c;代码本地跑起来莫得问题&#xff0c;错误日志提示让我跑一下npm run build &#xff0c;但是俺忽然发现&#xff0c;我跑了&#xff0c;文件打包好了&#xff0c;但是往哪里运行呢&#xff1f;这涉及到要构建一个环境供打包文件部署吧…

【Linux】线程池线程安全的单例模式和STL读者写者问题

需要云服务器等云产品来学习Linux的同学可以移步/–>腾讯云<–/官网&#xff0c;轻量型云服务器低至112元/年&#xff0c;优惠多多。&#xff08;联系我有折扣哦&#xff09; 文章目录 1. 线程池1.1 线程池是什么1.2 为什么要有线程池1.3 线程池的应用场景1.4 线程池的任…

ONLYOFFICE文档8.0新功能浅探

ONLYOFFICE文档8.0新功能浅探 上个月末这个月初的几天&#xff0c;ONLYOFFICE版本更新了&#xff01;更新到了一个比较整的大的版本号&#xff0c;8.0版本&#xff0c;看来这个生产力工具的升级速度基本上能保持每年两个版本号的速度&#xff0c;还是很快的&#xff0c;一般来…

【算法题】97. 交错字符串

题目 给定三个字符串 s1、s2、s3&#xff0c;请你帮忙验证 s3 是否是由 s1 和 s2 交错 组成的。 两个字符串 s 和 t 交错 的定义与过程如下&#xff0c;其中每个字符串都会被分割成若干 非空 子字符串&#xff1a; s s1 s2 ... sn t t1 t2 ... tm |n - m| < 1 交…

速盾:海外服务器用了cdn还是卡怎么办

海外服务器使用CDN卡顿问题的解决办法 在如今互联网高速发展的时代&#xff0c;海外服务器成为了许多企业和个人用户的首选&#xff0c;因为它能够提供更高的带宽和更稳定的网络连接。然而&#xff0c;尽管海外服务器在网络性能方面表现出色&#xff0c;但在使用过程中仍然可能…

【stomp实战】websocket原理解析与简单使用

一、WebSocket 原理 WebSocket是HTML5提供的一种浏览器与服务器进行全双工通讯的网络技术&#xff0c;属于应用层协议。它基于TCP传输协议&#xff0c;并复用HTTP的握手通道。浏览器和服务器只需要完成一次握手&#xff0c;两者之间就直接可以创建持久性的连接&#xff0c; 并…

多线程JUC:等待唤醒机制(生产者消费者模式)

&#x1f468;‍&#x1f393;作者简介&#xff1a;一位大四、研0学生&#xff0c;正在努力准备大四暑假的实习 &#x1f30c;上期文章&#xff1a;多线程&JUC&#xff1a;解决线程安全问题——synchronized同步代码块、Lock锁 &#x1f4da;订阅专栏&#xff1a;多线程&am…

Kubernetes实战(二十七)-HPA实战

1 HPA简介 HPA 全称是 Horizontal Pod Autoscaler&#xff0c;用于POD 水平自动伸缩&#xff0c; HPA 可以 基于 POD CPU 利用率对 deployment 中的 pod 数量进行自动扩缩容&#xff08;除了 CPU 也可以基于自定义的指标进行自动扩缩容&#xff09;。pod 自动缩放不适用于无法…

NGINX upstream、stream、四/七层负载均衡以及案例示例

文章目录 前言1. 四/七层负载均衡1.1 开放式系统互联模型 —— OSI1.2 四/七层负载均衡 2. Nginx七层负载均衡2.1 upstream指令2.2 server指令和负载均衡状态与策略2.2.1 负载均衡状态2.2.2 负载均衡策略 2.3 案例 3. Nginx四层负载均衡的指令3.1 stream3.2 upstream指令3.3 四…

深入理解ES的倒排索引

目录 数据写入过程 词项字典 term dictionary 倒排表 posting list FOR算法 RBM算法 ArrayContainer BitMapContainer 词项索引 term index 在Elasticsearch中&#xff0c;倒排索引的设计无疑是惊为天人的&#xff0c;下面看下倒排索引的结构。 倒排索引分为词项索引【…

JS中常用占位符使用方法详解_ |%s|%d|%f|%o|%O|%c|

在 JavaScript 中&#xff0c;%s 是一种字符串格式化占位符&#xff0c;用于将字符串插入到另一个字符串中的指定位置。这种方法基于 C 语言的 printf() 函数&#xff0c;但在 JavaScript 中有一些变化。 在 JavaScript 中&#xff0c;%s 可以接受任何类型的值&#xff0c;并将…

上市公司人工智能转型指数及55个工具变量汇总数据集(2024.2月更新)

一、“智能化转型”发文趋势和主题分布 二、数据来源 上市公司年报、官网&#xff0c;中国知网及各期刊官网等三、时间跨度 工具变量&#xff1a;2022-2024年&#xff1b; 上市公司人工智能转型指数&#xff1a;2007-2021年四、数据范围 中国A股上市公司五、数据展示 序号…

一键部署自动化运维工具spug

简介 Spug是面向中小型企业设计的轻量级无Agent的自动化运维平台&#xff0c;整合了主机管理、主机批量执行、主机在线终端、应用发布部署、在线任务计划、配置中心、监控、报警等一系列功能。 部署 1.创建目录 mkdir -p /opt/spug/{mysql,service,repos} 2.进入目录 cd /o…

Modern C++ 内存篇1 - allocator

1. 前言 从今天起我们开始内存相关的话题&#xff0c;内存是个很大的话题&#xff0c;一时不知从何说起。内存离不开allocator&#xff0c;我们就从allocator开始吧。allocator目前有两种&#xff1a;std::allocator, std::pmr::polymorphic_allocator&#xff0c;各有优缺点。…