上传文件
依赖包
npm i multer -S
npm @types/multer -D
第一步,注册存放图片的目录
注册的目录每一次重新运行后上传的文件会被清空
upload.module.ts
import { Module } from '@nestjs/common';
import { UploadService } from './upload.service';
import { UploadController } from './upload.controller';
import { MulterModule } from '@nestjs/platform-express'
import { diskStorage } from 'multer';
import { extname, join } from 'path';
@Module({
imports: [MulterModule.register({
storage: diskStorage({
// dist/images,相对于upload来说是../
destination: join(__dirname, '../images'),
filename: (_, file, callback) => {
console.log(file.originalname);
const fileName = `${new Date().getTime() + extname(file.originalname)}`
return callback(null, 'demo.png')
}
})
})],
controllers: [UploadController],
providers: [UploadService],
})
export class UploadModule { }
第二步,编写上传文件的方法
import { Controller, Get, Post, UseInterceptors, UploadedFile, Res } from '@nestjs/common';
import { UploadService } from './upload.service';
import { FileInterceptor, FilesInterceptor } from '@nestjs/platform-express'
@Controller('upload')
export class UploadController {
constructor(private readonly uploadService: UploadService) { }
// 上传图片
@Post("pic")
@UseInterceptors(FileInterceptor("file"))
uploadPic(@UploadedFile() file) {
console.log(file);
return "xxx"
}
}
下载文件
使用download下载
nest.js
import type { Response } from 'express'
import { join } from 'path';
@Get('download')
download(@Res() res: Response) {
// 从upload中往上层走,所有使用..
const url = join(__dirname, '../images/demo.png')
res.download(url)
}
html
window.open("http://localhost:3000/upload/download")
使用文件流下载
nest.js
import { zip } from 'compressing';
@Get('stream')
async download_stream(@Res() res: Response) {
// 从upload中往上层走,所有使用..
const url = join(__dirname, '../images/demo.png')
const tarStream = new zip.Stream()
await tarStream.addEntry(url)
res.setHeader('Content-Type','application/octet-stream')
res.setHeader('Content-Disposition',`attachment;filename=demo`
tarStream.pipe(res)
}
vue3
<script setup lang="ts">
const useFetch = async (url:string) => {
const res = await fetch(url).then(res => res.arrayBuffer())
console.log(res);
const a = document.createElement('a')
a.href = URL.createObjectURL(new Blob([res],{
}))
a.download = 'demo.zip'
a.click()
}
const download = ()=>{
useFetch('http://localhost:3000/upload/stream')
}
</script>
配置静态资源访问路径
// 配置静态资源的访问目录 , dist/images
// 配置前缀, 此项为可选
app.useStaticAssets(join(__dirname, "images"),{prefix: '/nest'})