Express是node的框架,通过Express我们快速搭建一个完整的网站,而不再只是前端了!所以Express还是非常值得学习的!

  express有各种中间件,我们可以在官方网站查询其用法。

  Express框架的核心特性如下:

  • 通过中间件来响应http请求。
  • 定义路由表来执行不同的HTTP请求动作。
  • 通过向模板传递参数来动态渲染页面。

  

安装Express


首先新建一个文件夹expressTest, 终端输入 npm init, 生成package.json文件。内容如下;

{
"name": "express",
"version": "1.0.0",
"description": "for Express test",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "no"
},
"keywords": [
"express"
],
"author": "Johon Zhu",
"license": "ISC"
}

使用cnpm安装express(注意:这里需要使用cnpm,使用npm会报错),

cnpm install express --save

执行之后,我们就可以发现在当前目录下多了一个node_modules文件,其中包含了express的相关文件。

在package.json文件中,可以发现多了依赖项express,如下:

"dependencies": {
"express": "^4.15.2"
}

安装下面几个重要的模块(安装express,就必须安装这几个配合使用)

  • body-parser   -  nodejs中间件,用于处理JSON、txt、Raw和Url编码的数据。
  • cookie-parser  -  用于解析cookie。
  • multer  -  nodejs中间件,用于处理enctype="multipart/form-data"的表单数据。
cnpm install body-parser --save
cnpm install cookie-parser --save
cnpm install multer --save

  此时,在package.json中我们就可以看到目前的依赖项已经包含了四项:

"dependencies": {
"body-parser": "^1.17.1",
"cookie-parser": "^1.4.3",
"express": "^4.15.2",
"multer": "^1.3.0"
}

  

第一个Express框架实例


在express.js文件下输入下面的代码:

var express = require('express');
var app = express(); app.get('/', function (req, res) {
res.send('Hello World');
}) var server = app.listen(, function () { var host = server.address().address
var port = server.address().port console.log("应用实例,访问地址为 http://%s:%s", host, port)
});

在浏览器中输入127.0.0.1:8081,页面输出Hello world。

可以看出,最后如果我们不log,express的例子将会更加简单,如下:

var express = require('express');
var app = express(); app.get('/', function (req, res) {
res.send('Hello World');
}) var server = app.listen();

同样在访问localhost:8081时可以看到页面显示Hello World。

重要: 因为引入了express框架,所以我们不需要自行再建立server.js、client.js,只需要通过这么一个文件就可以完成了。并且也没有引入url、http等。

补充:有时gitbash汉字无法正常显示,可在gitbash中右键-> options -> text -> 设置charset为utf-8。  即可解决问题。

Express 中的get、post


app.get('/', function (req, res) {
// --
})

其中,app为express(), 我们一般可以通过req和res来处理请求request和响应respond。

req对象包含了很多与请求相关的属性,重要的几个如下:

  • req.app 即访问express实例
  • req.body 获得请求主题
  • req.cookies 获得cookies
  • req.hostname获取主机名
  • req.ip获取主机ip
  • req.originalUrl 获取原始url
  • req.params 获取路由的parameters
  • req.path 获取请求路径
  • req.protocal 获取请求协议
  • req.query 获取url的查询字符串
  • req.accepts() 获取可接受的请求的文档类型
  • 。。。

res对象包含了很多和响应有关的属性,重要的几个如下:

  • res.cookie() 设置cookie
  • res.json() 传送json响应
  • res.jsonp() 传送jsonp响应
  • res.send() 传送http响应
  • res.status() 设置状态码
  • res.type() 设置Content-Type的MIME类型

路由


之前我们通过app.get("/", function (req, res) {...}) 来处理的,但是他们每次访问的都默认是主页,而路由决定不同的页面,即路径不同,就响应不同。

var express = require('express');
var app = express(); app.get('/', function (req, res) {
res.send("主页get请求");
});
app.post('/', function (req, res) {
res.send("主页post请求");
});
app.get('/delSomething', function (req, res) {
res.send("删除页面get请求");
});
app.get('/addSomething', function (req, res) {
res.send("添加页面get请求");
})

  app.get('/g*d', function (req, res) {
    res.send("输入g()d,可以正则匹配");
  });

var server = app.listen();

输出如下:

即路径不同,返回不同。 这就是路由。

静态文件


nodejs提供了express.static中间件来设置css、js、图片等静态文件。

即使用 express.use(express.static("public"));  即使用public文件夹下的静态文件,我们再public文件夹下放置一些css和js就可以访问了。如下:

var express = require("express");
var app = express();
app.use(express.static("public"));
app.get("/", function (req, res) {
res.send("hello");
});
app.listen();

即首先需要引入express,然后app.use(express.static("public")),表示需要使用静态资源,且在public文件中。 然后监听端口就可以了。

注意: 在请求时, 不需要输入public,只需要输入public内的文件即可。

get请求


之前在使用node时,使用过类似的,是一个post请求,这里用express实现get请求,index.html如下:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>index</title>
</head>
<body>
<form action="http://127.0.0.1:8081/process_get" method="get">
<input type="text" name="name" placeholder="name"><br>
<input type="text" name="age" placeholder="age"><br>
<input type="submit">
</form>
</body>
</html>

注意到action,即将数据发送到action所在的接口上,在下面的modejs文件中我们定义了如果处理这个接口。

js如下:

var express = require("express");
var app = express();
app.get("/index.html", function (req, res) {
res.sendFile(__dirname + "/" + "index.html");
});
app.get("/process_get", function (req, res) {
var response = {
name: req.query.name,
age: req.query.age
};
res.send(response);
});
app.listen();

即请求Index.html时,返回html,如果再通过get方式来发送表单,我们就把用户输入的以json字符串的形式返回。 (注意这里sendFile和__dirname的应用)

post请求


get请求比较简单实现,但是安全性不高,所以可以使用post,使用post不会再url上添加查询字符串,而是直接发送,但是需要我们使用body-parser来编码。 如下:

(注意:现在index.html的form内的method已经成了post, 如下:)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>index</title>
</head>
<body>
<form action="http://127.0.0.1:8081/process_get" method="post">
<input type="text" name="name" placeholder="name"><br>
<input type="text" name="age" placeholder="age"><br>
<input type="submit">
</form>
</body>
</html>

js如下所示:

var express = require("express");
var app = express();
var bodyParser = require("body-parser");
var urlEcode = bodyParser.urlencoded({extended: false});
app.get("/index.html", function (req, res) {
res.sendFile(__dirname + "/" + "index.html");
});
app.post("/process_post",urlEcode, function (req, res) {
var response = {
name: req.body.name,
age: req.body.age
};
res.send(response);
});
app.listen();

即首先引入express,然后引入body-parser,为什么呢? 我们在用get方法时直接传送查询字符串,但是post方法,就要传送数据了,而post方法就在body里,所以要使用body-parser将字符串解析为数据才能传送,最后,在处理post的接口process_post时,就要传入这个urlEcode作为参数用来解析, 另外值得注意的是response中要用req.body.name要和get方法里的req.query.name区分开来。

文件上传:


文件上传需要将index.html中form的enctype设置为multipart/form-data,这样才可以上传文件,另外,input的type设置为file。

如下:

<html>
<head>
<title>文件上传表单</title>
</head>
<body>
<form action="/file_upload" method="post" enctype="multipart/form-data">
<input type="file" name="image" size="" />
<br />
<input type="submit" value="上传文件" />
</form>
</body>
</html>

在nodejs中不仅仅要引入express,还要引入fs来对文件进行操作,引入body-parser来对文件的类型进行操作(类似于post),实际上文件上传就是post,因为post是传送的意思。

var express = require("express");
var app = express();
var bodyParser = require("body-parser");
var multer = require("multer");
var fs = require("fs"); app.use(express.static('public'));
app.use(bodyParser.urlencoded({extended: false}));
app.use(multer({dest: '/tmp/'}).array('image'));
var urlEcode = bodyParser.urlencoded({extended: false}); app.get("/index.html", function (req, res) {
res.sendFile(__dirname + "/" + "index.html");
});
app.post("/file_post",function (req, res) {
var des_file = __dirname + "/" + req.files[].originalname;
fs.readFile( req.files[].path, function (err, data) {
fs.writeFile(des_file, data, function (err) {
if( err ){
console.log( err );
}else{
response = {
message:'File uploaded successfully',
filename:req.files[].originalname
};
}
console.log( response );
res.end( JSON.stringify( response ) );
});
});
});
app.listen();

Cookie管理:


var express = require("express");
var cookieParser = require("cookie-parser"); var app = express();
app.use(cookieParser());
app.get('/', function (req, res) {
console.log("Cookies:",req.cookies);
});
app.listen();

引入cookie-parser,用于传递cookie,即向nodejs服务器发送cookie信息, req.cookies即客户端的cookie信息。

学习资源:http://study.163.com/category/nodejs?utm_source=baidu&utm_medium=cpc&utm_campaign=affiliate&utm_term=IT-419&utm_content=SEM

node之Express框架的更多相关文章

  1. Node.js Express 框架

    Node.js Express 框架 Express 简介 Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP ...

  2. Node.js Express框架

    Express 介绍 Express是一个最小的,灵活的Node.js Web应用程序框架,它提供了一套强大的功能来开发Web和移动应用程序. 它有助于基于Node Web应用程序的快速开发.下面是一 ...

  3. Node.js Express 框架学习

    转载:http://JavaScript.ruanyifeng.com/nodejs/express.html#toc0 感觉很牛的样子,不过觉得对初学者没太大用,里面很多例子用的api都没有详细的说 ...

  4. Node.js Express 框架 Express

    Express 简介 Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP 工具. 使用 Express 可以快速 ...

  5. 44.Node.js Express 框架--web框架

    转自:http://www.runoob.com/nodejs/nodejs-express-framework.html Express 简介 Express 是一个简洁而灵活的 node.js W ...

  6. Node.js+Express框架+Mongo学习(一)第一个node.js实例

    1.在桌面新建一个空的文件夹,比如叫node,当然也可以在其它地方新建. 2.命令行进入到所新建的文件夹的目录,下载Express框架,再在这个文件夹里新建一个叫final的项目 3.在项目(fina ...

  7. Node的express框架安装

    第一步:在cmd命令行下执行npm install -g express,安装全局的express. 第二步:在命令行中输入express,如果出现express不是内部命令时, 输入npm inst ...

  8. Node.js Express 框架 POST方法

    POST 方法 以下实例演示了在表单中通过 POST 方法提交两个参数,我们可以使用 server.js 文件内的 process_post 路由器来处理输入: index.htm 文件代码修改如下: ...

  9. Node.js Express 框架 GET方法

    GET 方法 以下实例演示了在表单中通过 GET 方法提交两个参数,我们可以使用 server.js 文件内的 process_get 路由器来处理输入: index.htm 文件代码如下: < ...

随机推荐

  1. 【实习项目记录】(二) JSON

    介绍 JSON JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式. 易于人阅读和编写.同时也易于机器解析和生成. 它基于JavaScript Program ...

  2. 浅谈delphi创建Windows服务程序与窗体实现交互

    我想实现的功能是创建一个服务程序,然后在服务Start时动态创建一个窗体Form,然后把Form缩小时变成TrayIcon放在Windows托盘上. 我在服务程序的OnStart事件中写到 Start ...

  3. Extjs Ext.TreePanel

    TreePanel 简单实例. <link rel="stylesheet" href="Js/ext-4.2/resources/css/ext-all-nept ...

  4. js 判断今天是否上班

    <script> var weekdate= getWeekDate() switch(weekdate){ case "星期一":; case "星期二&q ...

  5. 最近做手机端,GPS,微信QQ分享总结的问题

    Android端 百度地图: 1.libs包中armeabi下liblocSDK4d.so文件丢失,导致百度定位失效. 微信分享: 1.分享App,app的内容(图片加描述)不能超过32kb ,不然无 ...

  6. Ubuntu16.04切换python3和python2

    切换Python3为默认版本: sudo update-alternatives --install /usr/bin/python python /usr/bin/python2 100 sudo ...

  7. 【kudu pk parquet】TPC-H Query2对比解析

    这是[kudu pk parquet]的第二篇,query2在kudu和parquet上的对比解析,其中kudu包含有不能下发的谓词. 3台物理机,1T规模的数据集,impala和kudu版本是我们修 ...

  8. 个人JS体系整理(三)

    一. 严格模式 JavaScript 严格模式(strict mode)即在严格的条件下运行.首先声明,严格模式是ES5中提出来的,准确来说就是一句指令Use strict,它的目的是指定代码在严格条 ...

  9. 1222: FJ的字符串 [水题]

    1222: FJ的字符串 [水题] 时间限制: 1 Sec 内存限制: 128 MB 提交: 92 解决: 20 统计 题目描述 FJ在沙盘上写了这样一些字符串: A1  =  “A” A2  =   ...

  10. oracle转义用单引号

    参考:https://blog.csdn.net/learning_oracle_lh/article/details/46639507