发布时间：2019-08-05 03:17:05
在前端这个坑里摸爬滚打已经一年多了，终于下定决心写下自己第一篇博客（虽然内容原创居少，算是个整合内容），开始使用express的原因是因为自己想测试接收下前端上传图片并返回，实现图片上传。后端各位大大们又都比较忙，没办法了，只能自己上了（哎，都是逼出来的）。
此教程适合没有接触过node的web前端开发，快速构建自己的框架，基于express4.x。
首先安装express ，http://www.expressjs..cn/starter/installing.html，安装过程中一直回车到底就ok了。
安装完成后，继续安装express的应用骨架，生成默认项目
$ npm install express-generator -g（-g表示全局安装，下次可以直接使用，不用再次安装）
接着在myapp文件夹下直接运行express，项目目录就直接生成了
然后安装所有依赖包：
$ npm install启动这个应用（MacOS 或 Linux 平台）：
$ DEBUG=myapp npm startWindows 平台使用如下命令：
> set DEBUG=myapp & npm start看到这个页面时，大家已经完成了基础的项目构建，继续往上添加自己的代码就可以了。（到这部后大家可以把public目录下的文件夹修改为自己喜欢的格式，例如：js，css，只是一个路径而已）
接下来大家就可以把自己的页面添加到项目里面了，不过express到目前我只发现可以加载jade模板和ejs。大家不用担心还要从新学习jade，这里http://www.html2jade.org/，可以直接用工具把html转化为jade模板，可以让你手中已有的项目直接添加进去，jade模板在express的加载方法：http://www.expressjs..cn/guide/using-template-engines.html。其实jade的写法真的很简单，大家看一下api基本就能上手了，学习地址点这里。（项目里已经集成了jade，不用重复安装）
现在大家打开核心的app.js
这几行定义的是express的路由，大家可以简单了解下路由的作用，http://www.expressjs..cn/guide/routing.html，这点非常重要，一定要理解，不是很难，应该能够很快理解。
比如现在你打开http://localhost:3000/users页面，对应user.js里面的代码一看就能理解。(打开这个页面时发生了get请求)
下面咱们先不急着上传图片，先测试下前端发送的post和get请求。
以post请求为例，咱们把layout.jade修改成下面的样子
doctype html html head title= title link(rel='stylesheet', href='/css/style.css') script(type="text/javascript", src="/js/jquery.js") script(type="text/javascript", src="/js/index.js") body block content在public/js下新建个index.js，加载jquery（只是为了简写的ajax）有人可能会问为什么会没有public路径，因为Express 内置的 express.static 可以方便地托管静态文件，例如图片、CSS、JavaScript 文件等，详细内容点这里,对应app.js的内容为 app.use(express.static(path.join(__dirname, 'public')));
只有这样才能读取到文件。
下面开始修改js代码，public/js/index.js内写个最基础的ajax请求就好了，这里发送请求的路径为"/"，就是往主页发送请求（路由一定要理解，路由一定要理解，路由一定要理解！！）
$(document).ready(function() { $.post('/', {num: '12345678' }, function(data) { console.log(data) }); })然后在routes/index.js里面修改
var express = require('express'); var router = express.Router(); /* GET home page. */ router.get('/', function(req, res, next) { res.render('index', { title: 'Express' }); }); router.post('/', function(req, res) { res.send(req.body.num); }); module.exports = router;在此监听首页的post请求，req.body.num表示发送过来的数据，大家可以直接打印下req，看看里面包含了什么内容，加深理解（修改完文件后记得重启express）。
这时候在控制台中就可以看到返回的数据了。
现在大家已经可以使用node接收前端发送的请求了（是不是灰长开心！！），下面进行我们的重头戏，上传图片。
因为是测试接口，公司的项目要兼容低版本浏览器，所有plupload.js就上场了(不是我不想用h5的方法)。官网，下载后如图，就够用了。（记得在layout.jade里面加载）