Express 简介Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用和丰富的 HTTP 工具。使用 Express 可以快速地搭建一个完整功能的网站。Express 框架核心特性可以设置中间件来响应 HTTP 请求。定义了路由表用于执行不同的 HTTP 请求动作。可以通过向模板传递参数来动态渲染 HTML 页面。安装 Express安装 Express 并将其保存到依赖列表中$ cnpm install express --save以上命令会将 Express 框架安装在当前目录的node_modules目录中node_modules目录下会自动创建 express 目录。以下几个重要的模块是需要与 express 框架一起安装的body-parser- node.js 中间件用于处理 JSON, Raw, Text 和 URL 编码的数据。cookie-parser- 这就是一个解析Cookie的工具。通过req.cookies可以取到传过来的cookie并把它们转成对象。multer- node.js 中间件用于处理 enctypemultipart/form-data设置表单的MIME编码的表单数据。$ cnpm install body-parser --save $ cnpm install cookie-parser --save $ cnpm install multer --save安装完后我们可以查看下 express 使用的版本号$ cnpm list express /data/www/node └── express4.15.2 - /Users/tianqixin/www/node/node_modules/.4.15.2express第一个 Express 框架实例接下来我们使用 Express 框架来输出 Hello World。以下实例中我们引入了 express 模块并在客户端发起请求后响应 Hello World 字符串。创建 express_demo.js 文件代码如下所示express_demo.js 文件代码//express_demo.js 文件 var express require(express); var app express(); app.get(/, function (req, res) { res.send(Hello World); }) var server app.listen(8081, function () { var host server.address().address var port server.address().port console.log(应用实例访问地址为 http://%s:%s, host, port) })执行以上代码$ node express_demo.js 应用实例访问地址为 http://0.0.0.0:8081在浏览器中访问 http://127.0.0.1:8081结果如下图所示请求和响应Express 应用使用回调函数的参数request和response对象来处理请求和响应的数据。app.get(/, function (req, res) { // -- })request和response对象的具体介绍Request 对象- request 对象表示 HTTP 请求包含了请求查询字符串参数内容HTTP 头部等属性。常见属性有req.app当callback为外部文件时用req.app访问express的实例req.baseUrl获取路由当前安装的URL路径req.body / req.cookies获得「请求主体」/ Cookiesreq.fresh / req.stale判断请求是否还「新鲜」req.hostname / req.ip获取主机名和IP地址req.originalUrl获取原始请求URLreq.params获取路由的parametersreq.path获取请求路径req.protocol获取协议类型req.query获取URL的查询参数串req.route获取当前匹配的路由req.subdomains获取子域名req.accepts()检查可接受的请求的文档类型req.acceptsCharsets / req.acceptsEncodings / req.acceptsLanguages返回指定字符集的第一个可接受字符编码req.get()获取指定的HTTP请求头req.is()判断请求头Content-Type的MIME类型Response 对象- response 对象表示 HTTP 响应即在接收到请求时向客户端发送的 HTTP 响应数据。常见属性有res.app同req.app一样res.append()追加指定HTTP头res.set()在res.append()后将重置之前设置的头res.cookie(namevalue [option])设置Cookieopition: domain / expires / httpOnly / maxAge / path / secure / signedres.clearCookie()清除Cookieres.download()传送指定路径的文件res.get()返回指定的HTTP头res.json()传送JSON响应res.jsonp()传送JSONP响应res.location()只设置响应的Location HTTP头不设置状态码或者close responseres.redirect()设置响应的Location HTTP头并且设置状态码302res.render(view,[locals],callback)渲染一个view同时向callback传递渲染后的字符串如果在渲染过程中有错误发生next(err)将会被自动调用。callback将会被传入一个可能发生的错误以及渲染后的页面这样就不会自动输出了。res.send()传送HTTP响应res.sendFile(path [options] [fn])传送指定路径的文件 -会自动根据文件extension设定Content-Typeres.set()设置HTTP头传入object可以一次设置多个头res.status()设置HTTP状态码res.type()设置Content-Type的MIME类型路由我们已经了解了 HTTP 请求的基本应用而路由决定了由谁(指定脚本)去响应客户端请求。在HTTP请求中我们可以通过路由提取出请求的URL以及GET/POST参数。接下来我们扩展 Hello World添加一些功能来处理更多类型的 HTTP 请求。创建 express_demo2.js 文件代码如下所示express_demo2.js 文件代码var express require(express); var app express(); // 主页输出 Hello World app.get(/, function (req, res) { console.log(主页 GET 请求); res.send(Hello GET); }) // POST 请求 app.post(/, function (req, res) { console.log(主页 POST 请求); res.send(Hello POST); }) // /del_user 页面响应 app.get(/del_user, function (req, res) { console.log(/del_user 响应 DELETE 请求); res.send(删除页面); }) // /list_user 页面 GET 请求 app.get(/list_user, function (req, res) { console.log(/list_user GET 请求); res.send(用户列表页面); }) // 对页面 abcd, abxcd, ab123cd, 等响应 GET 请求 app.get(/ab*cd, function(req, res) { console.log(/ab*cd GET 请求); res.send(正则匹配); }) var server app.listen(8081, function () { var host server.address().address var port server.address().port console.log(应用实例访问地址为 http://%s:%s, host, port) })执行以上代码$ node express_demo2.js 应用实例访问地址为 http://0.0.0.0:8081接下来你可以尝试访问 http://127.0.0.1:8081 不同的地址查看效果。在浏览器中访问 http://127.0.0.1:8081/list_user结果如下图所示在浏览器中访问 http://127.0.0.1:8081/abcd结果如下图所示在浏览器中访问 http://127.0.0.1:8081/abcdefg结果如下图所示静态文件Express 提供了内置的中间件express.static来设置静态文件如图片 CSS, JavaScript 等。你可以使用express.static中间件来设置静态文件路径。例如如果你将图片 CSS, JavaScript 文件放在 public 目录下你可以这么写app.use(/public, express.static(public));我们可以到 public/images 目录下放些图片,如下所示node_modules server.js public/ public/images public/images/logo.png让我们再修改下 Hello World 应用添加处理静态文件的功能。创建 express_demo3.js 文件代码如下所示express_demo3.js 文件代码var express require(express); var app express(); app.use(/public, express.static(public)); app.get(/, function (req, res) { res.send(Hello World); }) var server app.listen(8081, function () { var host server.address().address var port server.address().port console.log(应用实例访问地址为 http://%s:%s, host, port) })执行以上代码$ node express_demo3.js 应用实例访问地址为 http://0.0.0.0:8081执行以上代码在浏览器中访问 http://127.0.0.1:8081/public/images/logo.png本实例采用了菜鸟教程的 logo结果如下图所示GET 方法以下实例演示了在表单中通过 GET 方法提交两个参数我们可以使用 server.js 文件内的process_get路由器来处理输入index.html 文件代码html body form action/process_get methodGET First Name: input typetext namefirst_name br Last Name: input typetext namelast_name input typesubmit valueSubmit /form /body /htmlserver.js 文件代码var express require(express); var app express(); app.use(/public, express.static(public)); app.get(/index.html, function (req, res) { res.sendFile( __dirname / index.html ); }) app.get(/process_get, function (req, res) { // 输出 JSON 格式 var response { first_name:req.query.first_name, last_name:req.query.last_name }; console.log(response); res.end(JSON.stringify(response)); }) var server app.listen(8081, function () { var host server.address().address var port server.address().port console.log(应用实例访问地址为 http://%s:%s, host, port) })执行以上代码node server.js 应用实例访问地址为 http://0.0.0.0:8081浏览器访问 http://127.0.0.1:8081/index.html如图所示现在你可以向表单输入数据并提交如下演示POST 方法以下实例演示了在表单中通过 POST 方法提交两个参数我们可以使用 server.js 文件内的process_post路由器来处理输入index.html 文件代码html body form actionhttp://127.0.0.1:8081/process_post methodPOST First Name: input typetext namefirst_name br Last Name: input typetext namelast_name input typesubmit valueSubmit /form /body /htmlserver.js 文件代码var express require(express); var app express(); var bodyParser require(body-parser); // 创建 application/x-www-form-urlencoded 编码解析 var urlencodedParser bodyParser.urlencoded({ extended: false }) app.use(/public, express.static(public)); app.get(/index.html, function (req, res) { res.sendFile( __dirname / index.html ); }) app.post(/process_post, urlencodedParser, function (req, res) { // 输出 JSON 格式 var response { first_name:req.body.first_name, last_name:req.body.last_name }; console.log(response); res.end(JSON.stringify(response)); }) var server app.listen(8081, function () { var host server.address().address var port server.address().port console.log(应用实例访问地址为 http://%s:%s, host, port) })执行以上代码$ node server.js 应用实例访问地址为 http://0.0.0.0:8081浏览器访问 http://127.0.0.1:8081/index.html如图所示现在你可以向表单输入数据并提交如下演示文件上传以下我们创建一个用于上传文件的表单使用 POST 方法表单 enctype 属性设置为 multipart/form-data。index.html 文件代码html head title文件上传表单/title /head body h3文件上传/h3 选择一个文件上传: br / form action/file_upload methodpost enctypemultipart/form-data input typefile nameimage size50 / br / input typesubmit value上传文件 / /form /body /htmlserver.js 文件代码var express require(express); var app express(); var fs require(fs); var bodyParser require(body-parser); var multer require(multer); app.use(/public, express.static(public)); app.use(bodyParser.urlencoded({ extended: false })); app.use(multer({ dest: /tmp/}).array(image)); app.get(/index.html, function (req, res) { res.sendFile( __dirname / index.html ); }) app.post(/file_upload, function (req, res) { console.log(req.files[0]); // 上传的文件信息 var des_file __dirname / req.files[0].originalname; fs.readFile( req.files[0].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[0].originalname }; } console.log( response ); res.end( JSON.stringify( response ) ); }); }); }) var server app.listen(8081, function () { var host server.address().address var port server.address().port console.log(应用实例访问地址为 http://%s:%s, host, port) })执行以上代码$ node server.js 应用实例访问地址为 http://0.0.0.0:8081浏览器访问 http://127.0.0.1:8081/index.html如图所示现在你可以向表单输入数据并提交如下演示Cookie 管理我们可以使用中间件向 Node.js 服务器发送 cookie 信息以下代码输出了客户端发送的 cookie 信息express_cookie.js 文件代码// express_cookie.js 文件 var express require(express) var cookieParser require(cookie-parser) var util require(util); var app express() app.use(cookieParser()) app.get(/, function(req, res) { console.log(Cookies: util.inspect(req.cookies)); }) app.listen(8081)执行以上代码$ node express_cookie.js现在你可以访问 http://127.0.0.1:8081 并查看终端信息的输出如下演示
Express 简介Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用和丰富的 HTTP 工具。使用 Express 可以快速地搭建一个完整功能的网站。Express 框架核心特性可以设置中间件来响应 HTTP 请求。定义了路由表用于执行不同的 HTTP 请求动作。可以通过向模板传递参数来动态渲染 HTML 页面。安装 Express安装 Express 并将其保存到依赖列表中$ cnpm install express --save以上命令会将 Express 框架安装在当前目录的node_modules目录中node_modules目录下会自动创建 express 目录。以下几个重要的模块是需要与 express 框架一起安装的body-parser- node.js 中间件用于处理 JSON, Raw, Text 和 URL 编码的数据。cookie-parser- 这就是一个解析Cookie的工具。通过req.cookies可以取到传过来的cookie并把它们转成对象。multer- node.js 中间件用于处理 enctypemultipart/form-data设置表单的MIME编码的表单数据。$ cnpm install body-parser --save $ cnpm install cookie-parser --save $ cnpm install multer --save安装完后我们可以查看下 express 使用的版本号$ cnpm list express /data/www/node └── express4.15.2 - /Users/tianqixin/www/node/node_modules/.4.15.2express第一个 Express 框架实例接下来我们使用 Express 框架来输出 Hello World。以下实例中我们引入了 express 模块并在客户端发起请求后响应 Hello World 字符串。创建 express_demo.js 文件代码如下所示express_demo.js 文件代码//express_demo.js 文件 var express require(express); var app express(); app.get(/, function (req, res) { res.send(Hello World); }) var server app.listen(8081, function () { var host server.address().address var port server.address().port console.log(应用实例访问地址为 http://%s:%s, host, port) })执行以上代码$ node express_demo.js 应用实例访问地址为 http://0.0.0.0:8081在浏览器中访问 http://127.0.0.1:8081结果如下图所示请求和响应Express 应用使用回调函数的参数request和response对象来处理请求和响应的数据。app.get(/, function (req, res) { // -- })request和response对象的具体介绍Request 对象- request 对象表示 HTTP 请求包含了请求查询字符串参数内容HTTP 头部等属性。常见属性有req.app当callback为外部文件时用req.app访问express的实例req.baseUrl获取路由当前安装的URL路径req.body / req.cookies获得「请求主体」/ Cookiesreq.fresh / req.stale判断请求是否还「新鲜」req.hostname / req.ip获取主机名和IP地址req.originalUrl获取原始请求URLreq.params获取路由的parametersreq.path获取请求路径req.protocol获取协议类型req.query获取URL的查询参数串req.route获取当前匹配的路由req.subdomains获取子域名req.accepts()检查可接受的请求的文档类型req.acceptsCharsets / req.acceptsEncodings / req.acceptsLanguages返回指定字符集的第一个可接受字符编码req.get()获取指定的HTTP请求头req.is()判断请求头Content-Type的MIME类型Response 对象- response 对象表示 HTTP 响应即在接收到请求时向客户端发送的 HTTP 响应数据。常见属性有res.app同req.app一样res.append()追加指定HTTP头res.set()在res.append()后将重置之前设置的头res.cookie(namevalue [option])设置Cookieopition: domain / expires / httpOnly / maxAge / path / secure / signedres.clearCookie()清除Cookieres.download()传送指定路径的文件res.get()返回指定的HTTP头res.json()传送JSON响应res.jsonp()传送JSONP响应res.location()只设置响应的Location HTTP头不设置状态码或者close responseres.redirect()设置响应的Location HTTP头并且设置状态码302res.render(view,[locals],callback)渲染一个view同时向callback传递渲染后的字符串如果在渲染过程中有错误发生next(err)将会被自动调用。callback将会被传入一个可能发生的错误以及渲染后的页面这样就不会自动输出了。res.send()传送HTTP响应res.sendFile(path [options] [fn])传送指定路径的文件 -会自动根据文件extension设定Content-Typeres.set()设置HTTP头传入object可以一次设置多个头res.status()设置HTTP状态码res.type()设置Content-Type的MIME类型路由我们已经了解了 HTTP 请求的基本应用而路由决定了由谁(指定脚本)去响应客户端请求。在HTTP请求中我们可以通过路由提取出请求的URL以及GET/POST参数。接下来我们扩展 Hello World添加一些功能来处理更多类型的 HTTP 请求。创建 express_demo2.js 文件代码如下所示express_demo2.js 文件代码var express require(express); var app express(); // 主页输出 Hello World app.get(/, function (req, res) { console.log(主页 GET 请求); res.send(Hello GET); }) // POST 请求 app.post(/, function (req, res) { console.log(主页 POST 请求); res.send(Hello POST); }) // /del_user 页面响应 app.get(/del_user, function (req, res) { console.log(/del_user 响应 DELETE 请求); res.send(删除页面); }) // /list_user 页面 GET 请求 app.get(/list_user, function (req, res) { console.log(/list_user GET 请求); res.send(用户列表页面); }) // 对页面 abcd, abxcd, ab123cd, 等响应 GET 请求 app.get(/ab*cd, function(req, res) { console.log(/ab*cd GET 请求); res.send(正则匹配); }) var server app.listen(8081, function () { var host server.address().address var port server.address().port console.log(应用实例访问地址为 http://%s:%s, host, port) })执行以上代码$ node express_demo2.js 应用实例访问地址为 http://0.0.0.0:8081接下来你可以尝试访问 http://127.0.0.1:8081 不同的地址查看效果。在浏览器中访问 http://127.0.0.1:8081/list_user结果如下图所示在浏览器中访问 http://127.0.0.1:8081/abcd结果如下图所示在浏览器中访问 http://127.0.0.1:8081/abcdefg结果如下图所示静态文件Express 提供了内置的中间件express.static来设置静态文件如图片 CSS, JavaScript 等。你可以使用express.static中间件来设置静态文件路径。例如如果你将图片 CSS, JavaScript 文件放在 public 目录下你可以这么写app.use(/public, express.static(public));我们可以到 public/images 目录下放些图片,如下所示node_modules server.js public/ public/images public/images/logo.png让我们再修改下 Hello World 应用添加处理静态文件的功能。创建 express_demo3.js 文件代码如下所示express_demo3.js 文件代码var express require(express); var app express(); app.use(/public, express.static(public)); app.get(/, function (req, res) { res.send(Hello World); }) var server app.listen(8081, function () { var host server.address().address var port server.address().port console.log(应用实例访问地址为 http://%s:%s, host, port) })执行以上代码$ node express_demo3.js 应用实例访问地址为 http://0.0.0.0:8081执行以上代码在浏览器中访问 http://127.0.0.1:8081/public/images/logo.png本实例采用了菜鸟教程的 logo结果如下图所示GET 方法以下实例演示了在表单中通过 GET 方法提交两个参数我们可以使用 server.js 文件内的process_get路由器来处理输入index.html 文件代码html body form action/process_get methodGET First Name: input typetext namefirst_name br Last Name: input typetext namelast_name input typesubmit valueSubmit /form /body /htmlserver.js 文件代码var express require(express); var app express(); app.use(/public, express.static(public)); app.get(/index.html, function (req, res) { res.sendFile( __dirname / index.html ); }) app.get(/process_get, function (req, res) { // 输出 JSON 格式 var response { first_name:req.query.first_name, last_name:req.query.last_name }; console.log(response); res.end(JSON.stringify(response)); }) var server app.listen(8081, function () { var host server.address().address var port server.address().port console.log(应用实例访问地址为 http://%s:%s, host, port) })执行以上代码node server.js 应用实例访问地址为 http://0.0.0.0:8081浏览器访问 http://127.0.0.1:8081/index.html如图所示现在你可以向表单输入数据并提交如下演示POST 方法以下实例演示了在表单中通过 POST 方法提交两个参数我们可以使用 server.js 文件内的process_post路由器来处理输入index.html 文件代码html body form actionhttp://127.0.0.1:8081/process_post methodPOST First Name: input typetext namefirst_name br Last Name: input typetext namelast_name input typesubmit valueSubmit /form /body /htmlserver.js 文件代码var express require(express); var app express(); var bodyParser require(body-parser); // 创建 application/x-www-form-urlencoded 编码解析 var urlencodedParser bodyParser.urlencoded({ extended: false }) app.use(/public, express.static(public)); app.get(/index.html, function (req, res) { res.sendFile( __dirname / index.html ); }) app.post(/process_post, urlencodedParser, function (req, res) { // 输出 JSON 格式 var response { first_name:req.body.first_name, last_name:req.body.last_name }; console.log(response); res.end(JSON.stringify(response)); }) var server app.listen(8081, function () { var host server.address().address var port server.address().port console.log(应用实例访问地址为 http://%s:%s, host, port) })执行以上代码$ node server.js 应用实例访问地址为 http://0.0.0.0:8081浏览器访问 http://127.0.0.1:8081/index.html如图所示现在你可以向表单输入数据并提交如下演示文件上传以下我们创建一个用于上传文件的表单使用 POST 方法表单 enctype 属性设置为 multipart/form-data。index.html 文件代码html head title文件上传表单/title /head body h3文件上传/h3 选择一个文件上传: br / form action/file_upload methodpost enctypemultipart/form-data input typefile nameimage size50 / br / input typesubmit value上传文件 / /form /body /htmlserver.js 文件代码var express require(express); var app express(); var fs require(fs); var bodyParser require(body-parser); var multer require(multer); app.use(/public, express.static(public)); app.use(bodyParser.urlencoded({ extended: false })); app.use(multer({ dest: /tmp/}).array(image)); app.get(/index.html, function (req, res) { res.sendFile( __dirname / index.html ); }) app.post(/file_upload, function (req, res) { console.log(req.files[0]); // 上传的文件信息 var des_file __dirname / req.files[0].originalname; fs.readFile( req.files[0].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[0].originalname }; } console.log( response ); res.end( JSON.stringify( response ) ); }); }); }) var server app.listen(8081, function () { var host server.address().address var port server.address().port console.log(应用实例访问地址为 http://%s:%s, host, port) })执行以上代码$ node server.js 应用实例访问地址为 http://0.0.0.0:8081浏览器访问 http://127.0.0.1:8081/index.html如图所示现在你可以向表单输入数据并提交如下演示Cookie 管理我们可以使用中间件向 Node.js 服务器发送 cookie 信息以下代码输出了客户端发送的 cookie 信息express_cookie.js 文件代码// express_cookie.js 文件 var express require(express) var cookieParser require(cookie-parser) var util require(util); var app express() app.use(cookieParser()) app.get(/, function(req, res) { console.log(Cookies: util.inspect(req.cookies)); }) app.listen(8081)执行以上代码$ node express_cookie.js现在你可以访问 http://127.0.0.1:8081 并查看终端信息的输出如下演示
