js上传限制文件大小
时间: 2023-08-12 11:04:32 浏览: 55
要限制文件上传的大小,需要在前端和后端都进行设置。
在前端,可以通过文件选择框的accept和multiple属性来限制文件类型和数量,以及通过文件对象的size属性来限制文件大小。例如:
```html
<input type="file" accept=".jpg,.png" multiple="multiple" onchange="checkFileSize(this)">
```
```javascript
function checkFileSize(input) {
const files = input.files;
const maxSize = 1024 * 1024; // 1MB
for (let i = 0; i < files.length; i++) {
if (files[i].size > maxSize) {
alert('文件大小不能超过1MB!');
input.value = ''; // 清空文件选择框
return;
}
}
}
```
在后端,需要在服务器端设置上传文件大小的限制。具体方法因不同的后端语言和框架而异。以 Node.js 和 Express 框架为例,可以使用 multer 中间件来处理文件上传,并设置文件大小限制。例如:
```javascript
const express = require('express');
const multer = require('multer');
const app = express();
const upload = multer({
limits: { fileSize: 1024 * 1024 } // 1MB
});
app.post('/upload', upload.single('file'), (req, res) => {
// 处理上传文件的业务逻辑
});
```
以上代码中,通过 limits 属性设置了文件大小限制为1MB。使用 upload.single('file') 中间件可以处理单个文件上传,'file' 是文件上传表单项的 name 属性值。