首页 > 其他分享 >限制图片上传时的文件大小和尺寸

限制图片上传时的文件大小和尺寸

时间:2023-03-07 16:46:27浏览次数:48  
标签:文件大小 image height width let file 尺寸 上传

const beforeUpload = (file: any) => {         const isLt2M = file.size / 1024 / 1024 < 2;     if (!isLt2M) {         ElMessage.error('上传头像图片大小不能超过 2MB!');     }     // 上传图片前处理函数     const isSize = new Promise(function(resolve, reject) {         let width = 240;         let height = 240;         let _URL = window.URL || window.webkitURL;         let image = new Image();         image.onload = function() {             let valid = image.width > width && image.height > height && image.width == image.height;             valid ? resolve() : reject();         };         image.src = _URL.createObjectURL(file);     }).then(         () => {             return file;         },         () => {             ElMessage.error("请上传240*240px以上,1:1的图标");             return Promise.reject();         }     );
    return isLt2M && isSize; }

标签:文件大小,image,height,width,let,file,尺寸,上传
From: https://www.cnblogs.com/guodadan/p/17188553.html

相关文章

  • 富文本编辑器粘贴word图片且图片文件自动上传功能
    ​ 1.编辑器修改(可选)1.1在 ueditor/config.json 中添加代码块    /* 上传word配置 */    "wordActionName":"wordupload",/* 执行上传视频的action......
  • HTML编辑器粘贴word图片且图片文件自动上传功能
    ​ 如何做到ueditor批量上传word图片?1、前端引用代码<!DOCTYPE html PUBLIC "-//W3C//DTDXHTML1.0Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml......
  • 文件上传下载
    一、文件上传介绍文件上传,也称为upload,是指将本地图片、视频、音频等文件上传到服务器上,可以供其它用户浏览或者下载的过程,文件上传在项目中应用非常广泛,我们经常发微博、......
  • WebUploader上传文件夹的三种解决方案
    ​ 1、介绍enctypeenctype 属性规定发送到服务器之前应该如何对表单数据进行编码。enctype作用是告知服务器请求正文的MIME类型(请求消息头content-type的作用一样)1、......
  • Springboot上传并解析Zip包
    packagecom.c2f.hbos.mcc.common.utils;importcom.c2f.hbos.mcc.core.catalog.enums.SHMedicationCatalogDataSourceEnum;importorg.apache.commons.compress.utils.......
  • B/S上传文件夹的三种解决方案
    ​ javaweb上传文件上传文件的jsp中的部分上传文件同样可以使用form表单向后端发请求,也可以使用ajax向后端发请求    1. 通过form表单向后端发送请求    ......
  • ASP.NET Core文件上传与下载(多种上传方式)
    前言前段时间项目上线,实在太忙,最近终于开始可以研究研究ASP.NETCore了.打算写个系列,但是还没想好目录,今天先来一篇,后面在整理吧.ASP.NETCore2.0发展到现在,已......
  • CSharp上传文件夹的三种解决方案
    ​ASP.NET上传文件用FileUpLoad就可以,但是对文件夹的操作却不能用FileUpLoad来实现。下面这个示例便是使用ASP.NET来实现上传文件夹并对文件夹进行压缩以及解压。ASP.NE......
  • 加深spring上传文件
    上传文件的详解创建控制层,上传文件:@ControllerpublicclassMyController{@PostMapping("/myUpload")publicStringupload(HttpServletRequestrequest){......
  • selenium+Autolt上传图片(非input属性)
    原理说明:autoit它设计用于WindowsGUI(图形用户界面)中进行自动化操作的一个程序,使用前需要安装,一般网站中图片上传会涉及到点击上传图片按钮就会弹出一个Windows的框用于......