当前位置: 首页 > news >正文

vue上传文件MD5加密

1.下载MD5依赖
npm install crypto-js
2.在utils文件夹中新增文件md5方法文件,文件名自定义(fileMd5Sum.js)

import CryptoJs from 'crypto-js' 
export default {// md5值计算fileMd5Sum(file) {let CryptoJS = require("crypto-js");return new Promise(resolve => {const fileReader = new FileReader();fileReader.onloadend = ev => {resolve(CryptoJS.MD5(CryptoJS.enc.Latin1.parse(ev.target.result)).toString(CryptoJS.enc.Hex));};fileReader.readAsBinaryString(file);});}
}

3.定义全局变量在main.js中引入

//文件md5计算方法
import fileMd5Sum from '@/utils/fileMd5Sum.js';
Vue.prototype.fileMd5Sum = fileMd5Sum;

4.使用

// files是上传的文件
this.fileMd5Sum.fileMd5Sum(files).then((res)-=>{console.log(res) // res就是加密后生成的md5
})

5.这是一个切片上传的例子

// dom
<el-upload :show-file-list="false" accept=".doc,.docx" ref="uploads" :limit="1" action:http-request="putinMirror3" :auto-upload="true"><el-button size="small" type="primary">数据上传</el-button><el-input v-model="addform.dataTestnMame" autocomplete="off" style="width:350px;margin-left: 20px;" disabledv-if="first4"></el-input><el-progress :text-inside="true" :stroke-width="26" :percentage="percentage4" v-if="!first4"style="position:absolute;left:150px;width:300px;top:0px"></el-progress></el-upload>// 切片上传putinMirror3(file) {let param = {fileName: file.file.name}firstFileUp(param).then(response => {var uploadId = response.data.uploadId// 每个文件切片大小定为5MBvar sliceSize = 50 * 1024 * 1024;//文件大小限制为最大10个G,可根据需求修改var filesizes = 100 * 1024 * 1024 * 1024;let that = this;const blob = file.file;const fileSize = blob.size;// 文件大小// this.fileNmae.push(blob.name)const fileName = blob.name;// 文件名//计算文件切片总数var totalSlice = 0;if (fileSize >= sliceSize) {totalSlice = Math.ceil(fileSize / sliceSize)} else {totalSlice = 1}var num = 0var list = []var guid = Date.parse(new Date())if (fileSize <= filesizes) {// 循环上传for (let i = 0; i < totalSlice; i++) {let start = i * sliceSize;let chunk = blob.slice(start, Math.min(fileSize, start + sliceSize));let files = new File([chunk], fileName)let partSize = files.sizethis.fileMd5Sum.fileMd5Sum(files).then(res => {var formData = new FormData();formData.append("uploadId", uploadId);formData.append("file", files);formData.append("partSize", partSize);formData.append("partNumber", i + 1);formData.append("md5Digest", res);let instance = axios.create({baseURL: 'baseUrl',data: formData,headers: { 'Content-Type': 'multipart/form-data', 'Authorization': "Bearer " + getAccessToken() }})this.first4 = falseinstance.post(`${this.uploadFileUrl}`, formData).then((res) => {if (res.data.code == 0) {list.push(res.data.data)this.percentage4 = Number(((list.length / totalSlice) * 100).toFixed(2))if (list.length == totalSlice) {let param = {uploadId: uploadId,partTags: list}secendFileUp(param).then(response => {this.fileList4.push(response.data)this.percentage4 = 100});}} else {that.$message({message: res.msg,type: 'error'});}})});}} else {that.$message({message: '文件大小超出10G',type: 'error'});}});},

相关文章:

vue上传文件MD5加密

1.下载MD5依赖 npm install crypto-js 2.在utils文件夹中新增文件md5方法文件&#xff0c;文件名自定义&#xff08;fileMd5Sum.js&#xff09; import CryptoJs from crypto-js export default {// md5值计算fileMd5Sum(file) {let CryptoJS require("crypto-js"…...

vue2 .sync 修饰符

vue2 .sync 修饰符 **创建 工程&#xff1a; H:\java_work\java_springboot\vue_study ctrl按住不放 右键 悬着 powershell H:\java_work\java_springboot\js_study\Vue2_3入门到实战-配套资料\01-随堂代码素材\day04\准备代码\13-sync修饰符 vue --version vue create v-sy…...

使用Tensorrt的一般步骤

使用Tensorrt的一般步骤 TensorRT的使用包括两个阶段&#xff1a;build and deployment。 build&#xff1a;该阶段主要完成模型转换&#xff08;从caffe或TensorFlow到TensorRT&#xff09;&#xff0c;如下图所示&#xff0c;在模型转换时会完成前述优化过程中的层间融合&am…...

uniapp apple 苹果登录 离线本地打包

官方文档 uni-app官网 文档写的不全&#xff0c;没有写离线打包流程 加lib 签名里带 sign in with apple hbuilder开关 代码 测试代码&#xff0c;获取app里所有的provider uni.getProvider({service: oauth,success: function (res) {console.log(res.provider)uni.showT…...

【数据库】Sql Server数据迁移,处理自增字段赋值

给自己一个目标&#xff0c;然后坚持一段时间&#xff0c;总会有收获和感悟&#xff01; 在实际项目开发中&#xff0c;如果遇到高版本导入到低版本&#xff0c;或者低版本转高版本&#xff0c;那么就会出现版本不兼容无法导入&#xff0c;此时通过程序遍历创建表和添加数据方式…...

JOSEF约瑟 矿用一般型选择性漏电继电器 LXY2-660 Φ45 JKY1-660

系列型号&#xff1a; JY82A检漏继电器 JY82B检漏继电器 JY82-380/660检漏继电器 JY82-IV检漏继电器 JY82-2P检漏继电器 JY82-2/3检漏继电器 JJKY检漏继电器 JD型检漏继电器 JY82-IV;JY82J JY82-II;JY82-III JY82-1P;JY82-2PA;JY82-2PB JJB-380;JJB-380/660 JD-12…...

DHCP自动分配IP原理

DHCP自动分配IP原理 1.采用UDP通信方式 2.服务器IP&#xff1a;255.255.255.255&#xff1b; 服务器端口&#xff1a;67, 设备接收端口&#xff1a;68 3.设备向服务器发送DISCOVER信息 4.设备收到服务器回应&#xff0c;且解析正确 5.设备向服务器发送REQUEST请求消息 6.设备接…...

读书笔记-《ON JAVA 中文版》-摘要26[第二十三章 注解]

文章目录 第二十三章 注解1. 基本语法1.1 基本语法1.2 定义注解1.3 元注解 2. 编写注解处理器2.1 编写注解处理器2.2 注解元素2.3 默认值限制 3. 使用javac处理注解4. 基于注解的单元测试5. 本章小结 第二十三章 注解 注解&#xff08;也被称为元数据&#xff09;为我们在代码…...

IDEA报Error:java:无效的源发行版13解决方式

出现问题原因&#xff1a;原本项目是spingboot2.0版本开发的&#xff0c;IDEA启动正常&#xff0c;后期新项目使用spingboot3.0&#xff0c;通过原来的IDEA版本及JDK1.8启动报上述错误&#xff0c;以下为版本文件 解决方式&#xff1a; 项目背景&#xff1a;项目已经上线&…...

基于SpringBoot的健身房管理系统

目录 前言 一、技术栈 二、系统功能介绍 会员信息管理 员工信息管理 会员卡类型管理 健身项目管理 会员卡管理 三、核心代码 1、登录模块 2、文件上传模块 3、代码封装 前言 随着信息技术在管理上越来越深入而广泛的应用&#xff0c;管理信息系统的实施在技术上已逐步…...

竞赛选题 深度学习 植物识别算法系统

文章目录 0 前言2 相关技术2.1 VGG-Net模型2.2 VGG-Net在植物识别的优势(1) 卷积核&#xff0c;池化核大小固定(2) 特征提取更全面(3) 网络训练误差收敛速度较快 3 VGG-Net的搭建3.1 Tornado简介(1) 优势(2) 关键代码 4 Inception V3 神经网络4.1 网络结构 5 开始训练5.1 数据集…...

希尔贝壳受邀参加《人工智能开发平台通用能力要求 第4部分:大模型技术要求》标准第一次研讨会

随着大模型技术与经验的不断累积&#xff0c;该方向也逐渐从聚焦技术突破&#xff0c;到关注开发、部署、应用的全流程工程化落地。为完善人工智能平台标准体系建设&#xff0c;满足产业多样化需求&#xff0c;2023年9月7日&#xff0c;中国信通院云大所在线上召开《人工智能开…...

虹科方案 | AR助力仓储物流突破困境:规模化运营与成本节约

文章来源&#xff1a;虹科数字化AR 点击阅读原文&#xff1a;https://mp.weixin.qq.com/s/xis_I5orLb6RjgSokEhEOA 虹科方案一览 HongKe DigitalizationAR 当今的客户体验要求企业在人员、流程和产品之间实现全面的连接。为了提升整个组织的效率并提高盈利能力&#xff0c;物流…...

spring容器ioc和di

spring ioc 容器的创建 BeanFactory 接口提供了一种高级配置机制&#xff0c;能够管理任何类型的对象&#xff0c;它是SpringIoC容器标准化超接口&#xff01; ApplicationContext 是 BeanFactory 的子接口。它扩展了以下功能&#xff1a; 更容易与 Spring 的 AOP 功能集成消…...

Maven 仓库地址

一、Maven 中央仓库地址 http://www.sonatype.org/nexus/http://mvnrepository.com/ &#xff08;本人推荐仓库&#xff09;http://repo1.maven.org/maven2 二、Maven 中央仓库地址大全 1、阿里中央仓库&#xff08;首选推荐&#xff09; <repository> <id>al…...

【2023研电赛】安谋科技企业命题特别奖:面向独居老人的智能居家监护系统

本文为2023年第十八届中国研究生电子设计竞赛安谋科技企业命题特别奖分享&#xff0c;参加极术社区的【有奖活动】分享2023研电赛作品扩大影响力&#xff0c;更有丰富电子礼品等你来领&#xff01;&#xff0c;分享2023研电赛作品扩大影响力&#xff0c;更有丰富电子礼品等你来…...

[Machine learning][Part4] 多维矩阵下的梯度下降线性预测模型的实现

目录 模型初始化信息&#xff1a; 模型实现&#xff1a; 多变量损失函数&#xff1a; 多变量梯度下降实现&#xff1a; 多变量梯度实现&#xff1a; 多变量梯度下降实现&#xff1a; 之前部分实现的梯度下降线性预测模型中的training example只有一个特征属性&#xff1a…...

LCR 078. 合并 K 个升序链表

LCR 078. 合并 K 个升序链表 题目链接&#xff1a;LCR 078. 合并 K 个升序链表 代码如下&#xff1a; class Solution { public:ListNode* mergeKLists(vector<ListNode*>& lists) {ListNode *lsnullptr;for(int i0;i<lists.size();i){lsmergeList(ls,lists[i])…...

JVM面试题:(三)GC和垃圾回收算法

GC: 垃圾回收算法&#xff1a; GC最基础的算法有三种&#xff1a; 标记 -清除算法、复制算法、标记-压缩算法&#xff0c;我们常用的垃圾回收器一般 都采用分代收集算法。 标记 -清除算法&#xff0c;“标记-清除”&#xff08;Mark-Sweep&#xff09;算法&#xff0c;如它的…...

hive建表指定列分隔符为多字符分隔符实战(默认只支持单字符)

1、背景&#xff1a; 后端日志采集完成&#xff0c;清洗入hive表的过程中&#xff0c;发现字段之间的单一字符的分割符号已经不能满足列分割需求&#xff0c;因为字段值本身可能包含分隔符。所以列分隔符使用多个字符列分隔符迫在眉睫。 hive在建表时&#xff0c;通常使用ROW …...

MongoDB学习和应用(高效的非关系型数据库)

一丶 MongoDB简介 对于社交类软件的功能&#xff0c;我们需要对它的功能特点进行分析&#xff1a; 数据量会随着用户数增大而增大读多写少价值较低非好友看不到其动态信息地理位置的查询… 针对以上特点进行分析各大存储工具&#xff1a; mysql&#xff1a;关系型数据库&am…...

【Java学习笔记】Arrays类

Arrays 类 1. 导入包&#xff1a;import java.util.Arrays 2. 常用方法一览表 方法描述Arrays.toString()返回数组的字符串形式Arrays.sort()排序&#xff08;自然排序和定制排序&#xff09;Arrays.binarySearch()通过二分搜索法进行查找&#xff08;前提&#xff1a;数组是…...

【Linux】C语言执行shell指令

在C语言中执行Shell指令 在C语言中&#xff0c;有几种方法可以执行Shell指令&#xff1a; 1. 使用system()函数 这是最简单的方法&#xff0c;包含在stdlib.h头文件中&#xff1a; #include <stdlib.h>int main() {system("ls -l"); // 执行ls -l命令retu…...

《Playwright:微软的自动化测试工具详解》

Playwright 简介:声明内容来自网络&#xff0c;将内容拼接整理出来的文档 Playwright 是微软开发的自动化测试工具&#xff0c;支持 Chrome、Firefox、Safari 等主流浏览器&#xff0c;提供多语言 API&#xff08;Python、JavaScript、Java、.NET&#xff09;。它的特点包括&a…...

基于当前项目通过npm包形式暴露公共组件

1.package.sjon文件配置 其中xh-flowable就是暴露出去的npm包名 2.创建tpyes文件夹&#xff0c;并新增内容 3.创建package文件夹...

[ICLR 2022]How Much Can CLIP Benefit Vision-and-Language Tasks?

论文网址&#xff1a;pdf 英文是纯手打的&#xff01;论文原文的summarizing and paraphrasing。可能会出现难以避免的拼写错误和语法错误&#xff0c;若有发现欢迎评论指正&#xff01;文章偏向于笔记&#xff0c;谨慎食用 目录 1. 心得 2. 论文逐段精读 2.1. Abstract 2…...

第25节 Node.js 断言测试

Node.js的assert模块主要用于编写程序的单元测试时使用&#xff0c;通过断言可以提早发现和排查出错误。 稳定性: 5 - 锁定 这个模块可用于应用的单元测试&#xff0c;通过 require(assert) 可以使用这个模块。 assert.fail(actual, expected, message, operator) 使用参数…...

【C++从零实现Json-Rpc框架】第六弹 —— 服务端模块划分

一、项目背景回顾 前五弹完成了Json-Rpc协议解析、请求处理、客户端调用等基础模块搭建。 本弹重点聚焦于服务端的模块划分与架构设计&#xff0c;提升代码结构的可维护性与扩展性。 二、服务端模块设计目标 高内聚低耦合&#xff1a;各模块职责清晰&#xff0c;便于独立开发…...

sipsak:SIP瑞士军刀!全参数详细教程!Kali Linux教程!

简介 sipsak 是一个面向会话初始协议 (SIP) 应用程序开发人员和管理员的小型命令行工具。它可以用于对 SIP 应用程序和设备进行一些简单的测试。 sipsak 是一款 SIP 压力和诊断实用程序。它通过 sip-uri 向服务器发送 SIP 请求&#xff0c;并检查收到的响应。它以以下模式之一…...

Mysql8 忘记密码重置,以及问题解决

1.使用免密登录 找到配置MySQL文件&#xff0c;我的文件路径是/etc/mysql/my.cnf&#xff0c;有的人的是/etc/mysql/mysql.cnf 在里最后加入 skip-grant-tables重启MySQL服务 service mysql restartShutting down MySQL… SUCCESS! Starting MySQL… SUCCESS! 重启成功 2.登…...