美文网首页koa2_admin
koa2下使用koa-multer上传文件

koa2下使用koa-multer上传文件

作者: 漫漫江雪 | 来源:发表于2018-04-28 18:01 被阅读0次

1、前置条件:
安装koa、koa-views、koa-multer、ejs、koa-router

cnpm i koa koa-views koa-multer ejs -S
cnpm i koa-router -S

2、准备模板文件 views/index.ejs

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>图片上传</title>
    <script src="http://cdn.bootcss.com/jquery/2.0.0/jquery.min.js"></script>
</head>
<body>
    <%= title %>
    <form action="/upload" method="post" enctype="multipart/form-data">
        <input type="file" name="file"/>
        <input type="submit" value="ok"/>
    </form>

</body>
</html>

3、demos/multer.js

const Koa=require('koa')
const multer=require('koa-multer')
const Router=require('koa-router')
const views=require('koa-views')
const path=require('path')
const app=new Koa()

//加载模板引擎
app.use(views(path.join(__dirname,'../views'),{
  extension:'ejs'
}))

const router=new Router()
router.get('/',async (ctx,next)=>{
  let title = 'hello koa2'
  await ctx.render('index', {
    title
  })
})

//文件上传
//配置
var storage = multer.diskStorage({
  //文件保存路径
  destination: function (req, file, cb) {
    cb(null, 'public/uploads/')
  },
  //修改文件名称
  filename: function (req, file, cb) {
    var fileFormat = (file.originalname).split(".");  //以点分割成数组,数组的最后一项就是后缀名
    cb(null,Date.now() + "." + fileFormat[fileFormat.length - 1]);
  }
})
//加载配置
var upload = multer({ storage: storage });
//路由
router.post('/upload',upload.single('file'),async(ctx,next)=>{
  console.log('abc')
  ctx.body = {
    filename: ctx.req.file.filename//返回文件名
  }
})

app.use(router.routes(), router.allowedMethods())

app.listen(5555,()=>{
  console.log('Server is running at port 5555...')
})

4、说明
上面代码中,文件的存放路径是 public/uploads,所以测试时要先建好该目录
启动:

node demos/multer.js
image.png
参考网址:https://blog.csdn.net/ziwoods/article/details/72822730

相关文章

  • koa2下使用koa-multer上传文件

    1、前置条件:安装koa、koa-views、koa-multer、ejs、koa-router 2、准备模板文件...

  • koa 上传文件

    上传文件 遇到的问题: 最开始用koa-multer,接口没问题回调执行了,但是文件没有传上去。折腾了两天,发现注...

  • node koa2图片上传debugger的问题

    首先需要搭建koa2环境,这里就不多说了。 接下来需要加载koa-multer: npm install koa-...

  • win与mac上传文件操作

    mac上传文件到web页面使用PyUserInput库下的PyKeyboard键盘操作类 win上传文件到web页面

  • 关于上传文件和提交表单的结合+复制文件问题

    使用webuploader上传文件,还要提交文件对应的属性。 思路:使用webuploader选择文件,上传文件,...

  • iOS文件上传

    文件上传的步骤 使用NSURLConnection上传文件例子 使用AFN框架上传图片例子 获取文件的MIMETy...

  • Koa2上传文件流

    点击查看官方示例 后台写法: 关键点:通过ctx 读取到前端的上传文件: 前端:需要按照正确的数据格式传到后端,后...

  • 文件上传与Koa2

    前言 本文仅为koa2上传文件(图片/文本/视频/音频)到七牛云的记叙。 关于我是如何找到该文档的? 在没有具体...

  • java web文件上传

    什么是文件上传 为什么使用文件上传 文件上传原理分析 上传文件注意事项 1,请求方式必须是post. 2,需要使用...

  • 阿里云OSS上传文件

    项目中使用到上传文件功能,网上搜索了下选择使用阿里云oss上传,查看官方文档。账号配置: 上传 OK!开始上传,发...

网友评论

    本文标题:koa2下使用koa-multer上传文件

    本文链接:https://www.haomeiwen.com/subject/rwxnlftx.html