导读:文件上传是一个很常见的场景,这里我们将学习单个文件上传,文件数组,多个文件,配置,访问
文件上传
基本实例(单个文件)
单个文件上传,FileInterceptor
@Post('upload')
@ApiConsumes('multipart/form-data')
@ApiBody({
description: '单个文件上传'
})
@UseInterceptors(FileInterceptor('file',{
// 限制大小
limits:{fileSize:1024*1024*5},
// 验证文件类型
// req:请求对象
// file: 上传的文件,进行类型判断的
// callback: 回调函数,用于返回验证结果 第一个参数位null或者error 第二个参数acceptFile 一个布尔值 。
fileFilter:(req,file,callback)=>{
callback(null,true)
}
}))//这里文件名要和上传参数名一致
uploadFile(@UploadedFile() file:Express.Multer.File){
return file
}
文件数组
FilesInterceptor
// 文件数组
@Post('uploadArray')
@ApiConsumes('multipart/form-data')
@ApiBody({
description:'文件数组'
})
@UseInterceptors(FilesInterceptor('files'))
uploadFiles(@UploadedFiles() files: Array<Express.Multer.File>){
console.log(files)
}
多个文件
FileFieldsInterceptor
// 多个文件
@Post('uploadMany')
@ApiConsumes('multipart/form-data')
@ApiBody({
description:'多个文件'
})
@UseInterceptors(FileFieldsInterceptor([
{name:'one'},{name:'two'}]))
uploadFileFields(@UploadedFiles() files:{one: Array<Express.Multer.File>,two:Array<Express.Multer.File>}){
console.log(files)
}
任何文件
AnyFilesInterceptor
// 任意文件
@Post('uploadAny')
@ApiConsumes('multpart/form-data')
@ApiBody({
description:'任意文件'
})
@UseInterceptors(AnyFilesInterceptor())
uploadAny(@UploadedFiles() files:Express.Multer.File[]){
console.log(files)
}
配置
MulterModule.registerAsync({
useFactory: async ()=>({
limits:{
fileSize:1024 * 1024 * 5,//5MB
},
// diskStorage 是 Multer 的一个存储引擎,用于将上传的文件保存到磁盘。
storage:diskStorage({
//destination 指定了上传文件的保存目录。
//_(请求对象,通常不使用),file(包含文件信息的对象),和 cb(回调函数,用于返回存储路径)。
destination:(_,file,cb)=>{
// 定义文件上传格式
const allowedImageTypes = ['gif', 'png', 'jpg', 'jpeg', 'bmp', 'webp', 'svg', 'tiff']; // 图片
const allowedOfficeTypes = ['xls', 'xlsx', 'doc', 'docx', 'ppt', 'pptx', 'pdf', 'txt', 'md', 'csv']; // office
const allowedVideoTypes = ['mp4', 'avi', 'wmv']; // 视频
const allowedAudioTypes = ['mp3', 'wav', 'ogg']; // 音频
// 根据上传的文件类型将图片视频音频和其他类型文件分别存到对应英文文件夹
const fileExtension = file.originalname.split('.').pop().toLowerCase();
let temp = 'other';
if(allowedImageTypes.includes(fileExtension)){
temp = 'image'
}else if(allowedOfficeTypes.includes(fileExtension)){
temp = 'office'
}else if(allowedVideoTypes.includes(fileExtension)){
temp = 'video'
}else if(allowedAudioTypes.includes(fileExtension)){
temp = 'audio'
}
// 文件以年月命名文件夹
const filePath = `public/${temp}/${dayjs().format('YYYY-MM')}`
// 判断文件夹是否存在
checkDirAndCreate(filePath)
return cb(null,`./${filePath}`)
},
filename:(_,file,cb)=>{
// 使用随机 uuid 生成文件名
const filename = `${uuidv4()}.${file.mimetype.split('/')[1]}`;
return cb(null,filename)
}
})
})
}
访问
使用apipost
完整代码
files.module
import { Module } from '@nestjs/common';
import { FilesService } from './files.service';
import { FilesController } from './files.controller';
import { MulterModule } from '@nestjs/platform-express';
import { diskStorage } from 'multer';
import * as dayjs from 'dayjs';
import { checkDirAndCreate } from 'src/utils';
import {v4 as uuidv4} from 'uuid';
@Module({
imports:[
MulterModule.registerAsync({
useFactory: async ()=>({
limits:{
fileSize:1024 * 1024 * 5,//5MB
},
// diskStorage 是 Multer 的一个存储引擎,用于将上传的文件保存到磁盘。
storage:diskStorage({
//destination 指定了上传文件的保存目录。
//_(请求对象,通常不使用),file(包含文件信息的对象),和 cb(回调函数,用于返回存储路径)。
destination:(_,file,cb)=>{
// 定义文件上传格式
const allowedImageTypes = ['gif', 'png', 'jpg', 'jpeg', 'bmp', 'webp', 'svg', 'tiff']; // 图片
const allowedOfficeTypes = ['xls', 'xlsx', 'doc', 'docx', 'ppt', 'pptx', 'pdf', 'txt', 'md', 'csv']; // office
const allowedVideoTypes = ['mp4', 'avi', 'wmv']; // 视频
const allowedAudioTypes = ['mp3', 'wav', 'ogg']; // 音频
// 根据上传的文件类型将图片视频音频和其他类型文件分别存到对应英文文件夹
const fileExtension = file.originalname.split('.').pop().toLowerCase();
let temp = 'other';
if(allowedImageTypes.includes(fileExtension)){
temp = 'image'
}else if(allowedOfficeTypes.includes(fileExtension)){
temp = 'office'
}else if(allowedVideoTypes.includes(fileExtension)){
temp = 'video'
}else if(allowedAudioTypes.includes(fileExtension)){
temp = 'audio'
}
// 文件以年月命名文件夹
const filePath = `public/${temp}/${dayjs().format('YYYY-MM')}`
// 判断文件夹是否存在
checkDirAndCreate(filePath)
return cb(null,`./${filePath}`)
},
filename:(_,file,cb)=>{
// 使用随机 uuid 生成文件名
const filename = `${uuidv4()}.${file.mimetype.split('/')[1]}`;
return cb(null,filename)
}
})
})
})
],
controllers: [FilesController],
providers: [FilesService],
})
export class FilesModule {}
files.controller
import { Controller, Get, Post, Body, Patch, Param, Delete, UseInterceptors, UploadedFile, UploadedFiles } from '@nestjs/common';
import { FilesService } from './files.service';
import { CreateFileDto } from './dto/create-file.dto';
import { UpdateFileDto } from './dto/update-file.dto';
import { AnyFilesInterceptor, FileFieldsInterceptor, FileInterceptor, FilesInterceptor } from '@nestjs/platform-express';
import { Express } from 'express';
import { ApiBody, ApiConsumes, ApiTags } from '@nestjs/swagger';
@Controller('files')
@ApiTags('Files')
export class FilesController {
constructor(private readonly filesService: FilesService) {}
@Get()
text(){
console.log("get files")
}
@Post('upload')
@ApiConsumes('multipart/form-data')
@ApiBody({
description: '单个文件上传'
})
@UseInterceptors(FileInterceptor('file',{
// 限制大小
limits:{fileSize:1024*1024*5},
// 验证文件类型
// req:请求对象
// file: 上传的文件,进行类型判断的
// callback: 回调函数,用于返回验证结果 第一个参数位null或者error 第二个参数acceptFile 一个布尔值 。
fileFilter:(req,file,callback)=>{
callback(null,true)
}
}))//这里文件名要和上传参数名一致
uploadFile(@UploadedFile() file:Express.Multer.File){
return file
}
// 文件数组
@Post('uploadArray')
@ApiConsumes('multipart/form-data')
@ApiBody({
description:'文件数组'
})
@UseInterceptors(FilesInterceptor('files'))
uploadFiles(@UploadedFiles() files: Array<Express.Multer.File>){
console.log(files)
}
// 多个文件
@Post('uploadMany')
@ApiConsumes('multipart/form-data')
@ApiBody({
description:'多个文件'
})
@UseInterceptors(FileFieldsInterceptor([
{name:'one'},{name:'two'}]))
uploadFileFields(@UploadedFiles() files:{one: Array<Express.Multer.File>,two:Array<Express.Multer.File>}){
console.log(files)
}
// 任意文件
@Post('uploadAny')
@ApiConsumes('multpart/form-data')
@ApiBody({
description:'任意文件'
})
@UseInterceptors(AnyFilesInterceptor())
uploadAny(@UploadedFiles() files:Express.Multer.File[]){
console.log(files)
}
}