uni-app使用使用Node+Koa2開發的后端程序接收上傳的文件
通過其它客戶端上傳(h5,小程序等),接收方法一致
使用koa接收時,我們需安裝一個中間件koa-body
安裝所需中間件
npm install --save koa-body
配置koa-body
//...code
const Koa = require('koa');
const koaBody = require("koa-body");
const app = new Koa();
app.use(koaBody({
multipart: true,
strict: false,//解析所有請求
formidable: {
maxFileSize: 200 * 1024 * 1024//文件大小限制
}
}))
//...code
uni-app中上傳文件請求
methods:{
/**
* 上傳文件
* @param {String} filePath 文件所在臨時路徑
*/
uploadFile:function(filePath){
uni.uploadFile({
url:`${this.baseUrl}/file/upload`,
formData:{
account:"123456",
typeName:"水果"
},
filePath:filePath,
name:"file",
success: (res) => {
console.log(res.data);
// {code:200,filename:"文件名.xx"}
}
})
}
}
上傳函數提示
- 上傳參數filePath 是uni.chooseImage API的成功回調參數tempPath(Array)中的內容
接收文件代碼
const fs = require("fs");
/**
* 處理文件上傳方法
* @requestParam {Number} account 賬號
* @requestParam {String} typeName 分類名稱
*/
const fn_uploadFile = async (ctx, next) => {
// 獲取body中攜帶的參數
const { account, typeName } = ctx.request.body;
// account:123456
// typeName:水果
// 通過ctx.request.files.file方法獲取上傳的文件對象
// 獲取文件名稱與文件所在路徑
const { name: filename, path } = ctx.request.files.file;
// 創建文件輸入流
const fileReader = fs.createReadStream(path);
// 文件將要的存放文件夾路徑
const fileDir = `${__dirname}/../../../upload-static/images/${account}/${typeName}`;
// 判斷目錄是否存在,目錄不存在則創建
if (!fs.existsSync(fileDir)) {
try {
fs.mkdirSync(fileDir);
} catch (e) {
console.error(e);
}
}
// 保存文件的最終路徑 (文件夾路徑+文件名)
const filepath = `${fileDir}/${filename}`;
// 創建文件輸出流
const fileWriter = fs.createWriteStream(filepath);
// 寫入文件數據
fileReader.pipe(fileWriter);
// 至此文件已上傳完成
// 向客戶端返回的內容
ctx.response.body={
code: 200,
filename
};
}
module.exports = {
"POST /api/file/upload": fn_uploadFile
}