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需要放到前端存储,不够安全,因此建议通过请求后端拿到签名数据后上传. 由于小程序的 ...
随机推荐
- asp.net去除HTML标签
public string NoHTML(string Htmlstring) //替换HTML标记 { //删除脚本 Htmlstring = Regex.Replace(Htmlstring, @ ...
- 通过真值树解析布尔表达式(eg:A&B|C)
第一步:求出一个表达式的truth tree 1.生成真值表 2.根据真值表生成真值树(合并短路产生相同的两个子树) /**************************************** ...
- git 命令行(四)-推送分支到远程
在本地新建一个分支: git branch newBranch 切换到你的新分支: git checkout newBranch 创建并切换到新分支: git checkout -b newBranc ...
- Matlab系列作业
(2019年2月19日注:Matlab这门课是在我大四上学期经历的,那时候开这篇文章是为了记录学习Matlab的时候遇到的坑,所以将所有的作业题合并到一篇文章中) 1.创建一个10*10的矩阵,矩阵所 ...
- PAT甲级——A1086 Tree Traversals Again
An inorder binary tree traversal can be implemented in a non-recursive way with a stack. For example ...
- Redis —yum安装全过程
访问 https://redis.io/download 官网,只看这一张图 一路执行完毕即安装成功,下面是执行过程图 看到显示redis的安装路径 接下来要配置下一些参数设置 https://www ...
- Python爬取b站任意up主所有视频弹幕
爬取b站弹幕并不困难.要得到up主所有视频弹幕,我们首先进入up主视频页面,即https://space.bilibili.com/id号/video这个页面.按F12打开开发者菜单,刷新一下,在ne ...
- Swagger发布服务器时错误 500 : { "Message": "An error has occurred." }
在做Web API的文档自动生成时,本机调试都正常,发布到服务器上出现500错误 500 : { "Message": "An error has occurred.&q ...
- vue 路由跳转记住滚动位置,返回时回到上次滚动位置
参考:https://blog.csdn.net/qq_40204835/article/details/79853685 方法一: 利用Keep-Alive和监听器 1.首先在路由中引入需要的模块 ...
- 比特镇旅游(Tourist Attractions)【暴力+Bitset 附Bitset用法】
Online Judge:NOIP2016十连测第一场 T2 Label:暴力,Bitset 题目描述 在美丽的比特镇一共有n个景区,编号依次为1到n,它们之间通过若干条双向道路连接. Byteasa ...