前端Vue使用AES的GCM模式加密

news2024/11/17 1:33:17

文章目录

  • 前端加密测试
  • Java加解密代码

写了个新的前端项目,公司要求,账号密码这些必须是加密传输的;后端使用了GCM模式加密,前端是复制的一个以前项目的代码,原来是有写加密的,使用的是CryptoJS组件CTR模式加密的,但是这个组件里面没有GCM加密模式,找了半天,发现浏览器其实是自带加密的组件的window.crypto,使用这个组件就可以使用GCM模式加密,代码贴在下面,顺便java代码也贴出来了。

CryptoJS 看点进源码里面看了下只支持这几种模式
在这里插入图片描述
去官网看了下 https://cryptojs.gitbook.io/docs#hashing,也是说支持这几种,估计是浏览器都支持了,所以CryptoJS也就没有再更新了吧
在这里插入图片描述

前端加密测试

包含了完整的加密解密代码,可以拷过去直接用

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8" />
	<title>加密小工具</title>
</head>
<body>
  <textarea rows="8" cols="40" id="content"></textarea>
  <br>
  <button onclick="encrypt1()">加密</button>
  <button onclick="decrypt1()">解密</button>
  <p>结果: <label id='result'></label></p>
</body>
<script type="text/javascript">

  // 将字符串转换为字节数组
  function stringToUint8Array(str) {
    let arr = new Uint8Array(str.length);
    for (let i = 0; i < str.length; i++) {
      arr[i] = str.charCodeAt(i);
    }
    return arr;
  }

  // 导入密钥
  async function importKey(keyStr) {
    const keyBytes = stringToUint8Array(keyStr);
    const key = await window.crypto.subtle.importKey(
      'raw',
      keyBytes,
      'AES-GCM', // 或者其他算法
      false,
      ['encrypt', 'decrypt']
    );
    return key;
  }

  // 加密函数
  async function encrypt(message, key, iv) {
    let msgBuffer = new TextEncoder().encode(message);
    let ivBytes = stringToUint8Array(iv);
    let ciphertext = await window.crypto.subtle.encrypt(
      {
        name: "AES-GCM",
        iv: ivBytes
      },
      key,
      msgBuffer
    );
    return ciphertext;
  }

  async function decrypt(base64Ciphertext, key, iv) {
    // 将 Base64 字符串转换回 ArrayBuffer
    let ciphertext = window.atob(base64Ciphertext);
    let ciphertextBuffer = new Uint8Array(ciphertext.length);
    for (let i = 0; i < ciphertext.length; i++) {
      ciphertextBuffer[i] = ciphertext.charCodeAt(i);
    }

    let ivBytes = stringToUint8Array(iv);
    let plaintext = await window.crypto.subtle.decrypt(
      {
        name: "AES-GCM",
        iv: ivBytes
      },
      key,
      ciphertextBuffer.buffer
    );

    // 将 ArrayBuffer 转换为字符串
    let decoder = new TextDecoder();
    return decoder.decode(plaintext);
  }

  let key;
  let ivStr;
  (async () => {
    const keyStr = "你的密钥";  //"29H3LCRC49SGFR0A";
    ivStr = "iv信息";   //"FBTR064AT3LCRF4E";
    key = await importKey(keyStr);

    const ciphertext = await encrypt("uIv86omN9Fp#", key, ivStr);

    console.log("Encrypted:", ciphertext);
  })();
  
  function encrypt1() {
    const txt = document.getElementById("content").value;
    encrypt(txt, key, ivStr).then((ciphertext) => {
      console.log("Encrypted:", btoa(String.fromCharCode(...new Uint8Array(ciphertext))));
      document.getElementById("result").innerText = btoa(String.fromCharCode(...new Uint8Array(ciphertext)));
    });
  }

  function decrypt1() {
    const txt = document.getElementById("content").value;
    decrypt(txt, key, ivStr).then((plaintext) => {
      console.log("Decrypted:", plaintext);
      document.getElementById("result").innerText = plaintext;
    });
  }
</script>
</html>

Java加解密代码

要先引入一个包

<dependency>
   <groupId>org.bouncycastle</groupId>
    <artifactId>bcprov-jdk18on</artifactId>
    <version>1.77</version>
</dependency>
package com.yuanjy.sf04;

import org.bouncycastle.jce.provider.BouncyCastleProvider;
import org.springframework.util.StringUtils;

import javax.crypto.Cipher;
import javax.crypto.KeyGenerator;
import javax.crypto.spec.IvParameterSpec;
import javax.crypto.spec.SecretKeySpec;
import java.net.URLDecoder;
import java.security.Security;
import java.util.Base64;

public class GCMTest {

    private static String key = "你的密钥"; //"29H3LCRC49SGFR0A";

    private static String ivParameter = "iv信息"; //"FBTR064AT3LCRF4E";

    private static IvParameterSpec IV;

    private static final String ALGORITHMSTR = "AES/GCM/NoPadding";

    public static void main(String[] args) throws Exception {
        Security.addProvider(new BouncyCastleProvider());
        System.out.println(encrypt("admin", key));
        System.out.println(decrypt("yagZI4sMNgee5R/AXhdFCPAjF1k4"));
    }

    public static String decrypt(String encrypt) throws Exception {
        return URLDecoder.decode(decrypt(encrypt, key), "UTF-8");
    }

    public static String decrypt(String encryptStr, String decryptKey) throws Exception {
        return decryptByBytes(Base64.getDecoder().decode(encryptStr), decryptKey);
    }

    public static String decryptByBytes(byte[] encryptBytes, String decryptKey) throws Exception {
        byte[] iv = ivParameter.getBytes();
        IV = new IvParameterSpec(iv);
        KeyGenerator kgen = KeyGenerator.getInstance("AES");
        kgen.init(128);
        Security.addProvider(new BouncyCastleProvider());
        Cipher cipher = Cipher.getInstance(ALGORITHMSTR, "BC");
        cipher.init(Cipher.DECRYPT_MODE, new SecretKeySpec(decryptKey.getBytes(), "AES"), IV);
        byte[] decryptBytes = cipher.doFinal(encryptBytes);
        return new String(decryptBytes);
    }

    public static String encrypt(String content, String encryptKey) throws Exception {
        return Base64.getEncoder().encodeToString(encryptToBytes(content, encryptKey));
    }

    public static byte[] encryptToBytes(String content, String encryptKey) throws Exception {
        byte[] iv = ivParameter.getBytes();
        IV = new IvParameterSpec(iv);
        KeyGenerator kgen = KeyGenerator.getInstance("AES");
        kgen.init(128);
        Cipher cipher = Cipher.getInstance(ALGORITHMSTR, "BC");
        cipher.init(Cipher.ENCRYPT_MODE, new SecretKeySpec(encryptKey.getBytes(), "AES"), IV);
        return cipher.doFinal(content.getBytes("utf-8"));
    }
}

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

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

相关文章

学生用的蓝牙耳机推荐有哪些?四款TOP榜单高人气机型分享

作为一个蓝牙耳机的重度使用党&#xff0c;耳机已经成为了学生们不可或缺的学习伴侣&#xff0c;声音对于我们学生党来说&#xff0c;选择一款性价比高、舒适度好且续航能力强的蓝牙耳机尤为重要&#xff0c;那么学生用的蓝牙耳机推荐有哪些&#xff1f;今天我就为大家推荐四款…

【机器学习】决策树------迅速了解其基本思想,Sklearn的决策树API及构建决策树的步骤!!!

目录 &#x1f354; 案例剖析 &#x1f354; 通过sklearn实现决策树分类并进一步认识决策树 &#x1f354; 基于规则构建决策树 &#x1f354; 构建决策树的三个步骤 &#x1f354; 小结 学习目标 &#x1f340; 了解决策树算法的基本思想 &#x1f340; 了解Sklearn的决策…

经纬恒润INTEWORK-TPA 新版本正式发布

在汽车电子研发领域&#xff0c;随着产品复杂度日益提升&#xff0c;测试工作的重要性愈发凸显。然而&#xff0c;测试用例撰写的繁琐、测试数据统计的困难以及报告管理的无序&#xff0c;常常让测试工程师们倍感压力。为了解决测试管理的难题&#xff0c;经纬恒润正式推出INTE…

拿到一个新项目,如何开展测试?

很多人拿到一个项目就开始用自己的理解进行测试&#xff0c;这样的话可能会造成因为自己对需求理解的偏差&#xff0c;导致在测试过程中会发现自己理解的需求跟开发实际做出来的功能不一致。其实&#xff0c;拿到一个新项目后&#xff0c;开展测试工作是一个系统而有序的过程。…

Python爬虫(一文通)

Python爬虫&#xff08;基本篇&#xff09; 一&#xff1a;静态页面爬取 Requests库的使用 1&#xff09;基本概念安装基本代码格式 应用领域&#xff1a;适合处理**静态页面数据和简单的 HTTP 请求响应**。 Requests库的讲解 含义&#xff1a;requests 库是 Python 中一个…

北京青蓝智慧科技: 我国网民规模近11亿人 互联网普及率达78%

中国互联网络信息中心&#xff08;CNNIC&#xff09;近日发布了最新一期《中国互联网络发展状况统计报告》。 根据报告&#xff0c;截至2024年6月&#xff0c;中国的网民数量接近11亿&#xff0c;具体数字为10.9967亿人&#xff0c;较2023年12月增加了742万&#xff0c;互联网…

【pyhton】python如何实现将word等文档中的文字转换成语音

✨✨ 欢迎大家来到景天科技苑✨✨ &#x1f388;&#x1f388; 养成好习惯&#xff0c;先赞后看哦~&#x1f388;&#x1f388; &#x1f3c6; 作者简介&#xff1a;景天科技苑 &#x1f3c6;《头衔》&#xff1a;大厂架构师&#xff0c;华为云开发者社区专家博主&#xff0c;…

空间计量 | 空间误差模型SEM

在空间OLS回归分析中如果得到LM检验并且判断得到应该使用空间误差SEM模型时&#xff0c;接着本文档介绍空间误差SEM模型。首先空间误差SEM模型的数学模式公式如下&#xff1a; y βk * x u , u λ * Wu &#xff08;为扰动项&#xff09;&#xff0c;Wu为误差(扰动项)空间…

登山第一梯:使用rviz显示bag包中的点云数据

第一步&#xff0c;连接ros master&#xff1a; roscore ​​​​​第二步&#xff0c;打开rviz&#xff08;默认的rviz&#xff09; rosrun rviz rviz ​第三步&#xff0c;查看bag包信息&#xff0c;获取topic信息 rosbag info [bag包路径] 有三个topic&#xff0c;分别时/bp…

SAP B1 三大基本表单标准功能介绍-物料主数据(上)

背景 在 SAP B1 中&#xff0c;科目表、业务伙伴主数据、物料主数据被称为三大基本表单&#xff0c;其中的标准功能是实施项目的基础。本系列文章将逐一介绍三大基本表单各个字段的含义、须填内容、功能等内容。 附上 SAP B1 10.0 的帮助文档&#xff1a;SAP Business One 10…

【测试】bug 相关知识点总结

目录 一、什么是 bug 二、描述 bug 的要素 三、bug 级别 四、bug 的生命周期 一、什么是 bug 在软件开发中&#xff0c;bug 是指软件程序中存在的错误、缺陷或故障。这些问题可能导致软件在运行时出现意外的行为、产生错误的结果、崩溃或无法正常工作。Bug 可以出现在软件…

【机器学习-神经网络】卷积神经网络

【作者主页】Francek Chen 【专栏介绍】 ⌈ ⌈ ⌈Python机器学习 ⌋ ⌋ ⌋ 机器学习是一门人工智能的分支学科&#xff0c;通过算法和模型让计算机从数据中学习&#xff0c;进行模型训练和优化&#xff0c;做出预测、分类和决策支持。Python成为机器学习的首选语言&#xff0c;…

6.824 lab2B raft 记录

Raft 2B Task LOG Implement the leader and follower code to append new log entries 您的第一个目标应该是传递 TestBasicAgree3B&#xff08;&#xff09;。 首先实现 Start&#xff08;&#xff09;&#xff0c;然后编写代码 通过 AppendEntries RPC 发送和接收新的日志条…

非整周期截取信号对FFT分析的影响

原文出自微信公众号【小小的电子之路】 自然界中的模拟信号大部分都是无限长的&#xff0c;或者说对计算机而言可以说是无限长的&#xff0c;而计算机只能处理有限长的信号&#xff0c;怎么办呢&#xff1f;以快速傅里叶变换为例&#xff0c;我们通常是截取目标信号中有限长的一…

<Rust>egui学习之小部件(八):如何在窗口中添加滑动条slider部件?

前言 本专栏是关于Rust的GUI库egui的部件讲解及应用实例分析&#xff0c;主要讲解egui的源代码、部件属性、如何应用。 环境配置 系统&#xff1a;windows 平台&#xff1a;visual studio code 语言&#xff1a;rust 库&#xff1a;egui、eframe 概述 本文是本专栏的第八篇博…

虚拟机Linux(Centos7)系统静态IP设置

文章目录 虚拟机Linux系统中通过DHCP获取IP地址的配置和静态IP设置1. 更改网络模式为NAT模式2. 设置虚拟机网络编辑器3. 配置网络文件3.1 修改网络配置文件3.2 添加静态IP、子网掩码和网关3.3 配置DNS 4. 重启网络服务5. 验证IP配置 虚拟机Linux系统中通过DHCP获取IP地址的配置…

LoRAMoE:缓解大模型的世界知识遗忘问题

人工智能咨询培训老师叶梓 转载标明出处 大模型&#xff08;LLMs&#xff09;在进行SFT时&#xff0c;通过增加指令数据量来提升其在多个下游任务中的性能或显著改善特定任务的表现。但研究者们发现&#xff0c;这种大规模的数据增加可能会导致模型遗忘其预训练阶段学习到的世…

加密与安全_前后端通过AES-CBC模式安全传输数据

文章目录 Pre概述前端加密是否有意义&#xff1f;环境准备加密方法、MODE和PADDING的选择前端后端应用&#xff1a;从传输到解密的全过程安全性增强动态生成密钥和初始向量1. 前端&#xff1a;动态生成密钥和IV2. 后端&#xff1a;解密动态密钥和IV 结语 Pre 加密与安全_解密A…

TMGM:欧元区通胀放缓将支持9月欧洲中央银行降息

八月份德国通胀率出乎意料的下降超过预期。欧洲中央银行可能会保持其放松的货币政策。美元/欧元矫正性下跌可能在本周结束前继续。 欧洲统计局将在周五公布八月份欧元区消费者价格(调和)指数(HICP)的预估数值&#xff0c;预期结果将支持9月份决策者降息的决定。 因为对经济增…

大数据-110 Flink 安装部署 下载解压配置 Standalone模式启动 打包依赖

点一下关注吧&#xff01;&#xff01;&#xff01;非常感谢&#xff01;&#xff01;持续更新&#xff01;&#xff01;&#xff01; 目前已经更新到了&#xff1a; Hadoop&#xff08;已更完&#xff09;HDFS&#xff08;已更完&#xff09;MapReduce&#xff08;已更完&am…