vue对文件进行加密,后台解密后保存

为什么要做加密解密?主要是避免第三方检测系统(WAF)检测出文件有问题,但是文件是用户上传的,我们控制不了这些文件,所以主要是通过对用户上传文件进行加密,后台解密后存储。

前端:

1: 安装crypto-js

npm install crypto-js -save

2: 编写工具:

import CryptoJS from 'crypto-js'
export function encryptFile(file) {// console.log("32---->: ",CryptoJS.lib.WordArray.random(32).toString(CryptoJS.enc.Hex).substring(0, 32))// console.log("16---->: ", CryptoJS.lib.WordArray.random(16).toString(CryptoJS.enc.Hex).substring(0, 16))const key = CryptoJS.enc.Utf8.parse("16ByteFixedKey12");  // 密钥需与后端一致‌:ml-citation{ref="8" data="citationList"}// console.log("key->: ",key)// const iv = CryptoJS.enc.Utf8.parse("f468c06be3fea831");     // IV需与后端一致‌:ml-citation{ref="8" data="citationList"}const iv = CryptoJS.enc.Utf8.parse('Fixed16ByteIV456');     // IV需与后端一致‌:ml-citation{ref="8" data="citationList"}// console.log("iv---->: ", iv)return new Promise((resolve, reject) => {const reader = new FileReader();reader.onload = (e) => {// const fileData = CryptoJS.lib.WordArray.create(e.target.result);const fileData = new Uint8Array(e.target.result);const wordArray = CryptoJS.lib.WordArray.create(fileData);const encrypted = CryptoJS.AES.encrypt(wordArray, key, {iv: iv,mode: CryptoJS.mode.CBC,padding: CryptoJS.pad.Pkcs7});// 转换为二进制Blob并上传‌:ml-citation{ref="4,5" data="citationList"}const encryptedBlob = new Blob([encrypted.toString()], { type: "application/octet-stream" });const encryptedFile = new File([encryptedBlob],file.name,{ type: "application/octet-stream" });encryptedFile.uid = file.uidresolve(encryptedFile); // 返回 Base64 格式密文};reader.readAsArrayBuffer(file.raw);});
}

3: 使用工具

// 收集所有加密的 Promiseconst promises = [];this.$refs.upload.$refs['upload-inner'].fileList.forEach(v => {if (v.status === 'ready') {const encryptPromise = encryptFile(v).then(res => {v.raw = resreturn v; // 返回 Promise 的结果});promises.push(encryptPromise); // 将 Promise 添加到数组}});// 等待所有加密操作完成后再提交Promise.all(promises).then(() => {// console.log("加密后")this.$refs.upload.submit(); // 所有加密完成后提交}).catch(error => {console.error('加密失败:', error);this.loading = false;});

后台(grails)

1: 增加包

implementation 'org.bouncycastle:bcprov-jdk15on:1.70'

2: 编写解密方法:

def decryptFile(def file) {def encryptedFile = file.inputStreamprintln file.originalFilenamebyte[] encryptedData = IOUtils.toByteArray(encryptedFile)// 将 Base64 字符串解码为原始密文字节数组String encryptedString = new String(encryptedData, "UTF-8")byte[] decodedData = java.util.Base64.getDecoder().decode(encryptedString)// 初始化解密器‌:ml-citation{ref="8" data="citationList"}SecretKeySpec secretKey = new SecretKeySpec("16ByteFixedKey12".getBytes("UTF-8"), "AES")IvParameterSpec ivSpec = new IvParameterSpec("Fixed16ByteIV456".getBytes("UTF-8"))Security.addProvider(new BouncyCastleProvider())Cipher cipher = Cipher.getInstance("AES/CBC/PKCS7Padding", "BC")cipher.init(Cipher.DECRYPT_MODE, secretKey, ivSpec)// 执行解密‌:ml-citation{ref="8" data="citationList"}return cipher.doFinal(decodedData);
//        byte[] decryptedBytes = cipher.doFinal(decodedData)
//
//        // 保存解密文件‌:ml-citation{ref="5" data="citationList"}
//        new File("/Users/zhangjiayu/Desktop/project/files/test.pdf").withOutputStream { it.write(decryptedBytes) }}

注意:

 前后台使用的key【16ByteFixedKey12】和IV【Fixed16ByteIV456】需要保持一致

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

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

相关文章

AI 在测试中的应用:从自动化到智能化的未来

阅读原文 在上一篇中,我们探讨了测试左移与右移如何构建质量保障的全流程闭环。现在,我们将目光投向更前沿的领域——AI在测试中的应用。这不仅是技术的演进,更是测试理念的革命:从"自动化执行"到"智能决策"…

Python:计算机二级:简单应用

文章目录 简单应用第一题第二题第三题第四题题型共同特点核心知识点讲解解题通用方法步骤 操作的难点1.数据的统计2.数据的筛选1. **条件判断筛选**2. **结合文件操作筛选**3. **多条件组合筛选** 类似题目其它一题 简单应用 第一题 题目 在考生文件夹下的PY202.py文件中&…

SQL Server 2022常见问题解答

以下是SQL Server 2022的常见问题解答,按主题分类整理: 一、安装与升级 SQL Server 2022的系统要求是什么? 支持的操作系统:Windows Server 2016及以上、Linux(Ubuntu 20.04/22.04, RHEL 8/9等)。内存:至少4GB(建议8GB+)。磁盘空间:6GB以上,具体取决于安装组件。如何…

力扣hot100_二分查找

二分查找 hot100_34.在排序数组中查找元素的第一个和最后一个位置 给你一个按照非递减顺序排列的整数数组 nums,和一个目标值 target。请你找出给定目标值在数组中的开始位置和结束位置。 如果数组中不存在目标值 target,返回 [-1, -1]。 你必须设计…

PostgreSQL详解

第一章:环境部署与基础操作 1.1 多平台安装详解 Windows环境 图形化安装 下载EnterpriseDB安装包(含pgAdmin) 关键配置项说明: # postgresql.conf优化项 max_connections 200 shared_buffers 4GB work_mem 32MB 服务管理命…

conda install 慢

针对 Solving environment: failed with initial frozen solve. Retrying with flexible solve 错误,以下是综合解决方案: 一、核心解决方法‌ ‌更新 Conda 至最新版本‌ 旧版本 Conda 的依赖解析算法可能存在缺陷,执行以下命令升级&#…

# 使用自定义Shell脚本hello快速配置Linux用户账户

使用自定义Shell脚本快速配置Linux用户账户 在学校实验室管理Linux服务器,或者公司小团队管理服务器时,大家需要一个能隔离自己服务,但是自己又需要对服务器的完整权限的情形。创建和配置用户账户是一项常见但繁琐的任务。特别是当你需要频繁…

Unity Animation的其中一种运用方式

Animation是Unity的旧的动画系统,先说目的,其使用是为了在UI中播放动效,并且在动效播放结束后接自定义事件而设计的 设计的关键点在于,这个脚本不是通过Animation直接播放动画片段,而是通过修改AnimationState的nor…

matplotlib——南丁格尔玫瑰

南丁格尔玫瑰图(Nightingale Rose Chart),是一种特殊形式的柱状图,它以南丁格尔(Florence Nightingale)命名,她在1858年首次使用这种图表来展示战争期间士兵死亡原因的数据。 它将数据绘制在极坐…

TensorFlow面试题及参考答案

目录 什么是 TensorFlow 的计算图?详细描述 TensorFlow 计算图的组成结构(节点、边、会话) 它与动态图(Eager Execution)的区别是什么?TensorFlow 静态计算图与动态图(Eager Execution)的区别及适用场景是什么? 解释张量(Tensor)的概念及其在 TensorFlow 中的作用…

6.go语言函数

Go语言中的函数是组织代码的最小单元,用于封装一段代码,完成特定的功能。函数的使用可以减少代码冗余,提高代码的可读性和可维护性。 函数的基本定义和语法 在Go语言中,定义一个函数的基本语法如下: func functionN…

SpringCould微服务架构之Docker(4)

Docker ce是社区版。 安装docker之前,先安装yum-util 。 安装docker之前,一定要先关闭防火墙。

Keepalived 实现高可用方案

Keepalived简介 ‌Keepalived‌ 是一个基于 ‌VRRP(Virtual Router Redundancy Protocol)协议‌的高可用性解决方案,主要用于实现‌服务故障自动切换(Failover)和负载均衡‌。通过管理虚拟 IP(VIP&#xf…

WPS JS宏编程教程(从基础到进阶)--第二部分:WPS对象模型与核心操作

第二部分:WPS对象模型与核心操作 WPS对象的属性、方法、集合 工作簿对象常用表达方式工作表对象常用表达方式单元格对象常用表达方式 单元格操作实战 单元格复制与重定位单元格偏移与尺寸调整 颜色设置专题 索引颜色与RGB颜色按条件动态设置单元格颜色 第二部分&…

基于DrissionPage的TB商品信息采集与可视化分析

一、项目背景 随着电子商务的快速发展,淘宝作为中国最大的电商平台之一,拥有海量的商品信息。这些数据对于市场分析、用户行为研究以及竞争情报收集具有重要意义。然而,由于淘宝的反爬虫机制和复杂的页面结构,直接获取商品信息并不容易。尤其是在电商行业高速发展的今天,商…

【003安卓开发方案调研】之ReactNative技术开发安卓

基于2025年最新行业动态和搜索资料,以下是针对国内使用React Native(RN)开发安卓应用的深度分析: 一、技术成熟度评估 1. 核心架构升级 新架构全面普及:2024年起,React Native的 新架构(Fabri…

JS数组方法

数组方法 一、数组 JavaScript 数组的大小是可调整的,并且可以包含不同 数据类型。(当不需要这些特性时,请使用 类型数组。) 注:JavaScript 类型数组是类似数组的对象,它提供了一种在内存缓冲区中读取和写…

【一起学Rust | Tauri2.0框架】深入浅出 Tauri 2.0 应用调试:从新手到专家的蜕变

前言 Tauri 是一款备受瞩目的跨平台桌面应用开发框架,它允许开发者使用 Web 技术栈(HTML、CSS、JavaScript)构建高性能、安全的原生应用。Tauri 2.0 的发布带来了诸多令人兴奋的新特性和改进,进一步提升了开发体验和应用性能。然…

Python项目-基于Python的网络爬虫与数据可视化系统

1. 项目简介 在当今数据驱动的时代,网络爬虫和数据可视化已成为获取、分析和展示信息的重要工具。本文将详细介绍如何使用Python构建一个完整的网络爬虫与数据可视化系统,该系统能够自动从互联网收集数据,进行处理分析,并通过直观…

TCP/IP三次握手的过程,为什么要3次?

一:过程 第一次(SYN): 客户端发送一个带有SYN标志的TCP报文段给服务器,设置SYN1,并携带初始序列号Seqx(随机值),进入SYN_SENT状态。等待服务器相应。 第二次&#xff08…