一段代码，koa上传文件，上传文件到腾讯云

秒速五厘米 2023-02-15 10:26 15阅读 0赞

上传图片文件对于内容管理的项目来说是一段最基本的代码，对于使用Nodejs开发来说，这段代码在配置上来说就相对的简单了不少，先不管性能上与其他框架来说有什么差距，起码对于小的项目来说，Nodejs作为web服务是一个不错的选择。

> 前端：form表单上传图片文件，KindEditor配置上传
> 
> 服务端：Koa、koa-body 接收文件

### 上传到服务器目录  ###

这里使用koa-body对文件上传进行配置，配置如下：

var koaBody = require('koa-body')
    app.use(koaBody({
        multipart: true,
        formidable: {
            maxFileSize: 2000 * 1024 * 1024    // 设置上传文件大小最大限制，默认2M
        }
    }))

配置好koa-body之后，我们就可以在路由方法中进行上传文件的操作，读取上传文件并保存到我们需要保存的路径当中

下面是前端页面，包括form表单上传文件，和KindEditor配置上传文件。

<!DOCTYPE html>
    <html>
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=0">
        <title>上传文件页面</title>
    </head>
    <body>
    
    <form action="/upload" method="post"
          enctype="multipart/form-data">
        
        <input type="file" name="file"  />
        <input type="file" name="file2"   />
        <input type="submit" name="submit" value="Submit" />
    </form>
    
    
    <textarea id="editor_id" name="content" style="width:700px;height:300px;">
    </textarea>
    </body>
    <script src="js/kindeditor/kindeditor-all-min.js"></script>
    <script>
        KindEditor.ready(function (K) {
            window.editor = K.create('#editor_id', {
                uploadJson: '/upload',
                filePostName: 'file',  // 服务端接收文件的名称
                allowFileManager: true,
                allowFlashUpload: false,
            });
        });
    </script>
    </html>

### 上传到腾讯云存储 ###

首先需要安装腾讯云提供的sdk

npm i cos-nodejs-sdk-v5

安装好腾讯云提供的上传文件的sdk之后，就可以对文件进行上传，下面就是使用cos上传文件的一个简单方法。

我们可以对上面的koa路由方法进行简单的修改，就可以将我们上传的文件再上传到腾讯云存储

// 首先引用上传的工具方法
    const cosUtil = require('./cosUtil')
    
    
    // 下面就是对koa路由方法进行的修改
    
    let file = ctx.request.files.file
    let uppath = file.path
    // 创建可读流
    let reader = fs.createReadStream(uppath);
    
    let newFilename = new Date().getTime() + '.' + file.name.split('.')[1];
    
    cosUtil.init()
            
    let cosResult = await cosUtil.putObject({
        key: `upload/${newFilename}`,
        buffer: reader,
    })
    
    ctx.body = {
        error: 0,
        url: `https://${cosResult.Location}`
    }

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2x3MDAxeA_size_16_color_FFFFFF_t_70][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2x3MDAxeA_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200605111124271.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2x3MDAxeA==,size_16,color_FFFFFF,t_70