uni-app开发的应用(小程序,app,web等),使用Node+Koa2开发的后端程序接收上传文件的方法
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
}
参考资源
uni-app开发的应用(小程序,app,web等),使用Node+Koa2开发的后端程序接收上传文件的方法的更多相关文章
- PHP开发-上传文件
<?php /****************************************************************************** 参数说明: $max_ ...
- 小程序云开发--云函数上传文件或图片 base64
云函数开发遇到的问题 在微信云开发环境当中,普通的用户并没有往云存储内写入文件的权限 所以普通用户想要使用wx.cloud.uploadFile显然是不现实的 但是我们同时也知道,云函数是后台服务端, ...
- Day12-微信小程序实战-交友小程序-搭建服务器与上传文件到后端
要搞一个小型的cms内容发布系统 因为小程序上线之后,直接对数据库进行操作的话,慧出问题的,所以一般都会做一个管理系统,让工作人员通过这个管理系统来对这个数据库进行增删改查 微信小程序其实给我们提供了 ...
- 微信小程序上传文件遇到的坑
在开发小程序时,使用的花生壳做的内网映射,域名使用花生壳卖的https域名 在做小程序文件上传时,调用接口,老是报错. Caused by: org.apache.commons.fileupload ...
- Linux下开发python django程序(设置admin后台管理上传文件和前台上传文件保存数据库)
1.项目创建相关工作参考前面 2.在models.py文件中定义数据库结构 import django.db import modelsclass RegisterUser(models.Model) ...
- 微信小程序小技巧系列《二》show内容展示,上传文件编码问题
作者:gou-tian 来自:github show内容展示 尝试用微信小程序的template组件实现.同时,尝试页面间转跳时传参,在目标页面引入模板文件实现 写的更少,做的更多 篇幅有限详细代码此 ...
- 转:【微信小程序】 微信小程序-拍照或选择图片并上传文件
调用拍照API:https://mp.weixin.qq.com/debug/wxadoc/dev/api/media-picture.html?t=20161222#wxchooseimageobj ...
- 【Azure 应用服务】使用PowerShell脚本上传文件至App Service目录
问题描述 使用PowerShell脚本上传文件至App Service目录的示例 脚本示例 对文件进行上传,使用的 WebClient.UploadFile 方法进行上传.当文件夹中包含子目录,执行以 ...
- Taro 微信小程序 上传文件到minio
小程序前端上传文件不建议直接引用minio的js npm包,一来是这个包本身较大,会影响小程序的体积,二来是ak sk需要放到前端存储,不够安全,因此建议通过请求后端拿到签名数据后上传. 由于小程序的 ...
随机推荐
- iOS逆向系列-Cycript
概述 Cycript 是Objective-C++.ES(JavaScript).Java等语法的混合物. 可以用来探索.修改.调试正在运行的Mac\iOS App. 通过Cydia安装Cycript ...
- grep 强大的文本搜索工具
1.grep -r "History folder does't exist:" * :中间是要搜索的文本,* 表示全部显示出来
- Python全栈开发:递归实例
#!/usr/bin/env python # -*- coding;utf-8 -*- """ 递归不能无限,python会限制递归深度,递归主要用于费布拉切数列 &q ...
- Android开发 StateListDrawable详解
前言 StateListDrawable是与xml中的selector属性对应代码实现类,它需要配合GradientDrawable的使用,如果你还不了解GradientDrawable可以参考我的另 ...
- [转]MEF学习
MEF学习 :http://www.cnblogs.com/comsokey/p/MEF1.html C#可扩展编程之MEF学习笔记(一):MEF简介及简单的Demo C#可扩展编程之MEF学习笔记( ...
- 【JZOJ3319】雪地踪迹
description 森林里有一片长方形的草地,在清晨的大雪过后被一层厚厚的积雪所掩盖(下图左). 住在森林里的兔子和狐狸,穿越草地,都会在雪地上留下他们的踪迹.他们总是从左上角进入,并从右下角离开 ...
- CSS - 定位相关
定位 (position) 1. 相对定位 (relative) 相对于元素原来的位置进行移动 2. 绝对定位 (absolute) 如果父级元素中有相对定位属性, 则参照父级元素进行定位, 默认参照 ...
- csps模拟测试74梦境,玩具,飘雪圣域题解
题面:https://www.cnblogs.com/Juve/articles/11679226.html 梦境: 其实还是挺水的,排序错了过不了样例,打了个二分图匹配就跑了 #include< ...
- Linux网桥端口的arp问题
Linux的brctl addif命令可以将一个接口加入到既有的网桥中,接下来,这个接口就成了brport,属于一个从属的接口,然而你还是可以看到它的,并且可以为它添加IP地址,然后route命令会显 ...
- 对XP上的KiFastSystemCall进行浅析
Windows API的系统调用过程通过KiFastSystemCall或int 2e进入内核,本文仅对XP上的KiFastSystemCall进行浅析. 以ntdll!ZwCreateProcess ...