在原始文件上传中显示maxFileSize消息,可以通过以下步骤实现:
示例代码(基于JavaScript和Node.js的Express框架):
前端HTML代码:
<form action="/upload" method="post" enctype="multipart/form-data">
<input type="file" name="file" id="fileInput">
<button type="submit">上传文件</button>
</form>
<div id="errorMsg"></div>
<script>
document.querySelector('form').addEventListener('submit', function(e) {
e.preventDefault();
var fileInput = document.getElementById('fileInput');
var file = fileInput.files[0];
var maxFileSize = 10 * 1024 * 1024; // 10MB
if (file.size > maxFileSize) {
document.getElementById('errorMsg').textContent = '文件大小超过限制';
} else {
// 文件上传逻辑
this.submit();
}
});
</script>
后端Node.js代码(使用multer中间件处理文件上传):
const express = require('express');
const multer = require('multer');
const app = express();
const upload = multer({ dest: 'uploads/' });
app.post('/upload', upload.single('file'), (req, res) => {
const file = req.file;
const maxFileSize = 10 * 1024 * 1024; // 10MB
if (file.size > maxFileSize) {
res.status(400).json({ error: '文件大小超过限制' });
} else {
// 文件上传逻辑
res.json({ message: '文件上传成功' });
}
});
app.listen(3000, () => {
console.log('服务器已启动');
});
以上代码仅为示例,实际应用中需要根据具体的开发语言、框架和业务需求进行相应的调整和优化。
腾讯云相关产品推荐:
领取专属 10元无门槛券
手把手带您无忧上云