RSA加密---前端---后端解密

本文涉及的产品
密钥管理服务KMS,1000个密钥,100个凭据,1个月
简介: RSA加密---前端加---后端解密

前端使用vue

RSA

准备工作

官网

jsencrypt :http://travistidwell.com/jsencrypt/

encryptlong:https://www.npmjs.com/package/encryptlong

1,安装

1.1 安装jsencrypt,执行以下命令

npm install jsencrypt

1.2 安装encryptlong,执行以下命令:

npm i  encryptlong  -S

2、开始--在导入包后在前端的工具库中直接封装RSA方法

代码

importJSEncryptfrom'jsencrypt';
/** * RSA公共加密方法-----单体版本 * @param value * @returns {string | false} * @constructor */exportfunctionRSA(value) {
constpublicKey="密钥";
constencrypt=newJSEncrypt();
encrypt.setPublicKey(publicKey);
consttest=encrypt.encrypt(value);
returntest}
/** * RSA公共加密方法-------数组+单体版本 * @param value * @returns {string | false} * @constructor */exportfunctionRSA(value) {
// RSA公钥constpublicKey="MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAqAc0oxV0IW8wTjKVd/bI"+"IvI2/o9c12ACq9FceDI8t5Z0GYOL7rAoL9/v6ev6MwzFzLyLaQhAGR6qV8AFQu1s"+"mwIDAQAB";
constencryptor=newJSEncrypt();
encryptor.setPublicKey(publicKey);
// 如果传入的值是数组,则对数组中的每个元素进行加密if (Array.isArray(value)) {
constencryptedArray= [];
value.forEach((item) => {
constencryptedValue=encryptor.encrypt(item);
encryptedArray.push(encryptedValue);
    });
returnencryptedArray;
  } else {
// 如果传入的值是单个值,则直接对其进行加密constencryptedValue=encryptor.encrypt(value);
returnencryptedValue;
  }
}

在封装完成方法之后在前端的main方法中直接注入!注入后直接可在前端任意方法中调用这个共有的方法。

注入!!!!!

//自定义RSA加密
import {RSA} from "./utils/index";
Vue.prototype.RSA = RSA

3、使用实例

submit() {
constencryptedPhone=this.RSA(ts.ruleForm.phone);
constencryptedPersonNo=this.RSA(ts.ruleForm.personNo);
constencryptedPassword=this.RSA(ts.ruleForm.collectionPassword);
letapiUrl="";
letparam= {
authorizedPerson: ts.ruleForm.authorizedPerson,
personNo: encryptedPersonNo,
phone: encryptedPhone,
departmentId: ts.ruleForm.departmentId,
educationDegree: ts.ruleForm.educationDegree,
qualificationNo: ts.ruleForm.qualificationNo,
certificateValidity: ts.ruleForm.certificateValidity,
authorizationValidity: ts.ruleForm.authorizationValidity,
collectionPassword: encryptedPassword,
annexFormId: ts.ruleForm.annexFormId,
authTypes: ts.ruleForm.authTypes,
rpAuthType: ts.ruleForm.rpAuthType,
trainScore: ts.ruleForm.trainScore,
      };
if (this.addFlg==0) {
apiUrl="application/ca/add";
      } else {
apiUrl="application/ca/edit";
param.id=this.formId;
      }
this.appHttp({
url: this.appHttp.adornAppRequestUrl(apiUrl),
method: "post",
data: this.appHttp.adornData(param),
headers: {
"Content-Type": "application/json", // 添加请求头,明确指定请求体为 JSON 格式        },
      }).then(({data}) => {
if (data.code==40000) {
ts.$message({
message: data.msg,
type: "success",
          });
this.processShell.reloadPage({
flowCode: "collection.authorization",
formId: data.id,
          });
        } else {
ts.$message.error(data.msg);
        }
      });
    },

4、Java后端代码

在Java中封装解密工具类RsaUtil后直接调用就可

importjava.nio.charset.StandardCharsets;
importjava.security.KeyFactory;
importjava.security.PrivateKey;
importjava.security.spec.PKCS8EncodedKeySpec;
importjava.util.Base64;
/*** @Author 薛千凝* @Date 2023/8/16 17:24*/publicclassRsaUtil {
// 解密密码字段publicstaticStringdecryptPassword(StringcollectionPassword) {
try {
// 获取私钥字符串,这里假设私钥存在 privateKeyStr 变量中StringprivateKeyStr="密钥";
// 解码私钥字符串为字节数组byte[] privateKeyBytes=Base64.getDecoder().decode(privateKeyStr);
// 构造 PKCS8EncodedKeySpec 对象PKCS8EncodedKeySpeckeySpec=newPKCS8EncodedKeySpec(privateKeyBytes);
// 获取 RSA 密钥工厂实例KeyFactorykeyFactory=KeyFactory.getInstance("RSA");
// 生成私钥对象PrivateKeyprivateKey=keyFactory.generatePrivate(keySpec);
// 创建解密器Ciphercipher=Cipher.getInstance("RSA/ECB/PKCS1Padding");
cipher.init(Cipher.DECRYPT_MODE, privateKey);
// 解密byte[] decryptedPasswordBytes=cipher.doFinal(Base64.getDecoder().decode(collectionPassword));
// 转换为字符串StringdecryptedPassword=newString(decryptedPasswordBytes, StandardCharsets.UTF_8);
returndecryptedPassword;
        } catch (Exceptione) {
e.printStackTrace();
returnnull;
        }
    }
}
目录
相关文章
|
2月前
|
存储 监控 前端开发
如何实现前端框架数据驱动方式的数据加密存储?
实现前端框架数据驱动方式的数据加密存储需要综合考虑多个因素,包括加密算法的选择、密钥管理、传输安全、服务器端处理等。通过合理的设计和实施,能够有效提高数据的安全性,保护用户的隐私和敏感信息。但需要注意的是,前端加密存储不能完全替代后端的安全措施,后端的安全防护仍然是不可或缺的。
47 3
|
6天前
|
开发框架 小程序 前端开发
圈子社交app前端+后端源码,uniapp社交兴趣圈子开发,框架php圈子小程序安装搭建
本文介绍了圈子社交APP的源码获取、分析与定制,PHP实现的圈子框架设计及代码编写,以及圈子小程序的安装搭建。涵盖环境配置、数据库设计、前后端开发与接口对接等内容,确保平台的安全性、性能和功能完整性。通过详细指导,帮助开发者快速搭建稳定可靠的圈子社交平台。
66 17
|
18天前
|
机器学习/深度学习 前端开发 算法
婚恋交友系统平台 相亲交友平台系统 婚恋交友系统APP 婚恋系统源码 婚恋交友平台开发流程 婚恋交友系统架构设计 婚恋交友系统前端/后端开发 婚恋交友系统匹配推荐算法优化
婚恋交友系统平台通过线上互动帮助单身男女找到合适伴侣,提供用户注册、个人资料填写、匹配推荐、实时聊天、社区互动等功能。开发流程包括需求分析、技术选型、系统架构设计、功能实现、测试优化和上线运维。匹配推荐算法优化是核心,通过用户行为数据分析和机器学习提高匹配准确性。
57 3
|
2月前
|
存储 前端开发 安全
如何确保前端框架数据驱动方式的数据加密存储的兼容性?
确保前端框架数据驱动方式的数据加密存储的兼容性需要综合考虑多个因素,通过充分的评估、测试、关注和更新,以及与其他技术的协调配合,来提高兼容性的可靠性,为用户提供稳定和安全的使用体验。
39 2
|
2月前
|
资源调度 前端开发 JavaScript
vite3+vue3 实现前端部署加密混淆 javascript-obfuscator
【11月更文挑战第10天】本文介绍了在 Vite 3 + Vue 3 项目中使用 `javascript-obfuscator` 实现前端代码加密混淆的详细步骤,包括安装依赖、创建混淆脚本、修改 `package.json` 脚本命令、构建项目并执行混淆,以及在 HTML 文件中引用混淆后的文件。通过这些步骤,可以有效提高代码的安全性。
124 2
|
2月前
|
前端开发 JavaScript 安全
vite3+vue3 实现前端部署加密混淆 javascript-obfuscator
【11月更文挑战第7天】本文介绍了在 Vite 3 + Vue 3 项目中使用 `javascript-obfuscator` 实现前端代码加密混淆的详细步骤。包括项目准备、安装 `javascript-obfuscator`、配置 Vite 构建以应用混淆,以及最终构建项目进行混淆。通过这些步骤,可以有效提升前端代码的安全性,防止被他人轻易分析和盗用。
339 0
|
3月前
|
前端开发 小程序 Java
java基础:map遍历使用;java使用 Patten 和Matches 进行正则匹配;后端传到前端展示图片三种情况,并保存到手机
这篇文章介绍了Java中Map的遍历方法、使用Pattern和matches进行正则表达式匹配,以及后端向前端传输图片并保存到手机的三种情况。
32 1
|
3月前
|
NoSQL Java Redis
shiro学习四:使用springboot整合shiro,正常的企业级后端开发shiro认证鉴权流程。使用redis做token的过滤。md5做密码的加密。
这篇文章介绍了如何使用Spring Boot整合Apache Shiro框架进行后端开发,包括认证和授权流程,并使用Redis存储Token以及MD5加密用户密码。
49 0
shiro学习四:使用springboot整合shiro,正常的企业级后端开发shiro认证鉴权流程。使用redis做token的过滤。md5做密码的加密。
|
3月前
|
前端开发 JavaScript Java
导出excel的两个方式:前端vue+XLSX 导出excel,vue+后端POI 导出excel,并进行分析、比较
这篇文章介绍了使用前端Vue框架结合XLSX库和后端结合Apache POI库导出Excel文件的两种方法,并对比分析了它们的优缺点。
1055 0
|
3月前
|
存储 人工智能 前端开发
前端大模型应用笔记(三):Vue3+Antdv+transformers+本地模型实现浏览器端侧增强搜索
本文介绍了一个纯前端实现的增强列表搜索应用,通过使用Transformer模型,实现了更智能的搜索功能,如使用“番茄”可以搜索到“西红柿”。项目基于Vue3和Ant Design Vue,使用了Xenova的bge-base-zh-v1.5模型。文章详细介绍了从环境搭建、数据准备到具体实现的全过程,并展示了实际效果和待改进点。
220 14