最近自学了一下NodeJS,然后做了一个小demo,实现歌曲的添加、修改、播放和删除的功能,其中自然要实现音乐和图片的上传功能。于是上网查找资料,找到了一个formidable插件,该插件可以很好的实现文件的上传功能。该小demo用到了MySQL数据库,所有的数据都存放到了数据库中。下面简单说一些如何使用。

1.创建app.js主文件

const express = require('express');
const router = require('./router');
const path = require('path');
const bodyParser = require('body-parser'); const app = express(); //静态资源服务
app.use('/uploads', express.static(path.join(__dirname, 'uploads')));
app.use('/node_modules', express.static(path.join(__dirname, 'node_modules'))); //配置模板引擎
app.set('views', path.join(__dirname, 'views'));
app.engine('.html', require('ejs').renderFile);
app.set('view engine', 'html'); //配置解析普通表单post请求体
app.use(bodyParser.urlencoded({extended:false})); //加载路由系统
app.use(router); app.listen(3000, '127.0.0.1', () => {
console.log('server is running at port 3000.');
})

2.html文件中的form表单

add.html文件:

<form action="/add" method="post" enctype="multipart/form-data">
<div class="form-group">
<label for="title">标题</label>
<input type="text" class="form-control" id="title" name="title" placeholder="请输入音乐标题">
</div>
<div class="form-group">
<label for="artist">歌手</label>
<input type="text" class="form-control" id="singer" name="singer" placeholder="请输入歌手名称">
</div>
<div class="form-group">
<label for="music_file">音乐</label>
<input type="file" id="music" name="music" accept="audio/*">
<p class="help-block">请选择要上传的音乐文件.</p>
</div>
<div class="form-group">
<label for="image_file">海报</label>
<input type="file" id="poster" name="img" accept="image/*">
<p class="help-block">请选择要上传的音乐海报.</p>
</div>
<button type="submit" class="btn btn-success">点击添加</button>
</form>

注意:method="post" enctype="multipart/form-data"

3.创建路由router.js文件

const express = require('express');
const router = express.Router();
const handler = require('./handler'); router
.get('/', handler.showIndex)
.get('/musicList', handler.getMusicList)
.get('/add', handler.showAdd)
.post('/add', handler.doAdd)
.get('/edit', handler.showEdit)
.post('/edit', handler.doEdit)
.get('/remove', handler.doRemove) module.exports = router;

  注意:router.js文件中的依赖不用多说。

4.创建handler.js文件

const formidable = require('formidable');
const config = require('./config');
const db = require('./common/db');
const path = require('path');
const fs = require('fs');
exports.doAdd = (req, res) => {
const form = new formidable.IncomingForm();
form.uploadDir = config.uploadDir;//上传文件的保存路径
form.keepExtensions = true;//保存扩展名
form.maxFieldsSize = 20 * 1024 * 1024;//上传文件的最大大小
form.parse(req, (err, fields, files) => {
if (err) {
throw err;
}
const title = fields.title;
const singer = fields.singer;
const music = path.basename(files.music.path);
const img = path.basename(files.img.path);
db.query('INSERT INTO music (title,singer,music,img) VALUES (?,?,?,?)', [
title,
singer,
music,
img
], (err, rows) => {
if (err) {
throw err;
}
res.redirect('/');
})
})
};

NodeJS使用formidable实现文件上传的更多相关文章

  1. NodeJS+formidable实现文件上传加自动重命名

    前述 本人node初学者,此前使用原生node实现文件上传时遇到了一些困难,只做到了.txt 和.png两中格式的文件可以正常上传,如果上传其他格式文件服务端保存的文件会无法正常打开,原因是对form ...

  2. nodejs 实现简单的文件上传功能

    首先需要大家看一下目录结构,然后开始一点开始我们的小demo. 文件上传总计分为三种方式: 1.通过flash,activeX等第三方插件实现文件上传功能. 2.通过html的form标签实现文件上传 ...

  3. NodeJs 使用 multer 实现文件上传

    Multer 是一个 node.js 中间件,用于处理 multipart/form-data 类型的表单数据,它主要用于上传文件 注意: Multer 不会处理任何非 multipart/form- ...

  4. 在 Node 中使用 formidable 处理文件上传

    具体使用方式参照官方文档:https://www.npmjs.com/package/formidable 第一:安装: # npm install --save formidable yarn ad ...

  5. nodejs使用multiparty模块实现文件上传(另附express.bodyParser()的说明)

    最近师弟师妹们在用formidable做文件上传的时候会出现form.parse()不会触发的问题,在stackoverflow也没有找到答案,反而是几个答案推荐使用multiparty来代替,因为那 ...

  6. javascript结合nodejs实现多文件上传

    前端文件上传功能比较依赖后端,所以第一步用nodejs实现一个供文件上传的功能接口. 因为本人对nodejs也是一知半解,所以刚开始的想法是像原始的ajax交互那样,获取上传文件的内容,然后再通过no ...

  7. Nodejs进阶:基于express+multer的文件上传

    关于作者 程序猿小卡,前腾讯IMWEB团队成员,阿里云栖社区专家博主.欢迎加入 Express前端交流群(197339705). 正在填坑:<Nodejs学习笔记> / <Expre ...

  8. node express formidable 文件上传后修改文件名

    //我是用php的思想来学习nodejs var express = require('express'); var router = express.Router(); var fs = requi ...

  9. 【转】NodeJS教程--基于ExpressJS框架的文件上传

    本文是翻译的一篇文章,原文地址:Handle File Uploads in Express (Node.js). 在NodeJS发展早期上传文件是一个较难操作的功能,随后出现了formidable. ...

随机推荐

  1. TortoiseGIT创建及合并分支

    一.创建分支 项目右键 => TortoiseGit(T) => 创建分支,然后右键切换到刚刚创建的分支,新增/修改一个文件,提交分支到远端服务器,推送成功之后分支就创建好了. 二.合并分 ...

  2. React.js深入学习详细解析

    今天,继续深入学习react.js. 目录: 一.JSX介绍 二.React组件生命周期详解 三.属性.状态的含义和用法 四.React中事件的用法 五.组件的协同使用 六.React中的双向绑定   ...

  3. SIHA环境修改主机名实施步骤

    目 录 1 实施需求 2 修改主机名 2.1 停止HAS服务 2.2 修改主机名 3 重新配置服务 3.1 使用root用户重新配置CSS & OHAS服务 3.2 设置cssd自动启动属性 ...

  4. MVP社区巡讲-云端基础架构:12月5日北京站 12月12日上海站

    紧跟当今的技术发展趋势还远远不够,我们要引领变革!加入本地技术专家社区,获取真实案例.实况培训演示以及探讨新一代解决方案.在此活动中,您将: 了解如何运用开源(OSS)技术.Microsoft 技术及 ...

  5. 2011奥斯卡最佳纪录片《监守自盗(Inside Job)》小结

    影片探讨了2008年金融危机产生的原因. 美国忽略1933年的旧法律,立新法,以放松金融监管. 投资银行被允许更高的杠杆率,33:1,也就是说,投资物跌价3%就会导致破产. 投资银行放贷,但是转手将贷 ...

  6. APNS 远程推送通知 PUSH deviceToken

    服务器向客户端推送消息:      当应用程序推到后台,或者根本就没有运行(我们的代码无能为力)      如果这种情况之下,应用程序想和用户交互(传统的做法 不可能)      推送 APNS:Ap ...

  7. 你所不知道的linq

    问题的提出 昨天在qq群问了一个linq的问题被人鄙视了.题目大概类似于 var reuslt=from s in new List<string>() select s; 问from.. ...

  8. MSSQL练习题

    下列属于SQL Server的系统数据库是( ) A.modelB.publicC.NorthwindD.System 答案:http://hovertree.com/tiku/bjaf/06nvv7 ...

  9. GridView详细介绍

    GridView控件的属性 表10.6 GridView控件的行为属性属性描述AllowPaging指示该控件是否支持分页.AllowSorting指示该控件是否支持排序.AutoGenerateCo ...

  10. C#多线程--线程池(ThreadPool)

    先引入一下线程池的概念: 百度百科:线程池是一种多线程处理形式,处理过程中将任务添加到队列,然后在创建线程后自动启动这些任务.线程池线程都是后台线程.每个线程都使用默认的堆栈大小,以默认的优先级运行, ...