本文主要是介绍NodeJS和Express框架,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
文章目录
- 1 引包
- 1.1 小案例
- 2 express中的静态引用详解
- 2.1 静态资源和动态资源
- 2.1.1 app.use
- 2.1.2 express.static
- 2.1.3 express静态引用总结
- 3 NodeJS中的热部署
- 4 模板引擎渲染
- 4.1 先安装相关的包
- 4.2 配置 art-template 模板引擎
- 4.3 使用模板引擎
- 5 post提交
- 5.1 安装post中间件
- 5.2 使用post
- 5.2.1 extended:true/false 区别
- 6 express中间件
- 6.1 基本理解
- 6.2 错误处理
1 引包
在要执行文件的目录里,先生成包文件npm init
在相应的主文件目录里通过npm install express --save
把express下载下来
1.1 小案例
var express = require("express")
var app=express();
app.get("/",function(req,res){console.log(req.url)res.end(`<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8" /><title>Document</title></head><body><img src="../img/test.jpg"/><h1>hello Express!你好</h1></body></html>`);
})
app.listen(3000,function(){console.log("3000 port server is running ......")
});
2 express中的静态引用详解
var express = require("express")
var app=express();
2.1 静态资源和动态资源
-
静态资源文件通俗的可以理解成对于不同的用户来说,内容都不会变化的文件。比如不管是任何人访问百度,他们所接收到的看到的图片、css文件和前端javascript文件都是一样的,我们称这类文件为静态资源文件。
-
那么响应的,对于不同用户做出不同反应的就是动态文件了,张三李四王五登录百度,百度会分别对他们显示"你好张三"、“你好李四”、“你好王五”,那么负责这么动态逻辑的文件就是动态文件了,根据你是用的技术不同,动态文件可能是.jsp文件、php文件或者我们node.js的服务器端js文件。
2.1.1 app.use
app.use
是浏览器里面请求地址URL中的一部分:即http:localhost:8000/
里面的/
, 默认URL是'/'
,也就是处理任何请求,同时要注意的是他会处理path下的子路径,比如如果设置path为’/hello’,那么当请求路径为’/hello/’,’/hello/nihao’,’/hello/bye’这样的请求都会交给app.use
处理的
2.1.2 express.static
expres.static是文件地址,为了提供对静态资源文件(图片、csss文件、javascript文件)的服务,请使用Express内置的中间函数 express.static 。Express 会在静态资源目录下查找文件,所以 不需要把静态目录作为URL的一部分
。
app.use('/img/',express.static(__dirname+'/img'))//绝对路径写法
app.use('/img/', express.static('./img/'))//相对对路径写法
app.use('/img/', express.static('img'))//相对对路径另一种写法
2.1.3 express静态引用总结
app.use('/public/',express.static('./public/'))
use
里面是请求的URL
路径,static
是本地文件路径
简单的来说就是用use
函数里面的请求url
路径来替换static
里面的路径了
例如app.use('/a/b/c',express.static('./public/'))
就是说要请求public
下面的test.img
时,url
路径里面不能有public
应该是http:localhost:8000/a/b/c/test.img
app.use(express.static('./public/'))
要请求public
下面的test.img
时,url
路径里面仍然是不能有public
应该是http:localhost:8000/test.img
3 NodeJS中的热部署
npm install --global nodemon
启动时是nodemon app.js
这样每次修改就不要重新启动
4 模板引擎渲染
4.1 先安装相关的包
npm install --save art-template
npm install --save express-art-template
4.2 配置 art-template 模板引擎
app.engine('html', require('express-art-template'))
- 第一个参数,表示,当渲染以
.html
结尾的文件的时候,使用 art-template 模板引擎 - express-art-template 是专门用来在 Express 中把 art-template 整合到 Express 中
- 虽然外面这里不需要记载 art-template,但是也必须安装原因就在于 express-art-template 依赖了 art-template
4.3 使用模板引擎
- 使用方法
res.render('html模板名', {模板数据})
- Express 为 Response 相应对象提供了一个方法:
render
render
方法默认是不可以使用,但是如果配置了模板引擎就可以使用了注意:
第一个参数不能写路径
,默认会去项目中的views
目录查找该模板文件- 也就是说 Express 有一个约定:开发人员把所有的视图文件都放到
views
目录中 - 如果想要修改默认的 views 目录
- 则可以
app.set('views', render函数的默认路径)
第一个参数必须是views
,不能修改 - 还是使用模板引擎的八字胡语法
5 post提交
5.1 安装post中间件
req.query 只能拿 get 请求参数,配置 body-parser 中间件(插件,专门用来解析表单 POST 请求体)
npm install --save body-parser
5.2 使用post
- 添加body-parser后,请求参数里
req
会多一个字段属性body
body
返回值是一个对象,里面是键值对储存的参数
// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }))
// parse application/json
app.use(bodyParser.json())
urlencoded
方法主要解析类似于网址后缀的参数形式 post的默认格式,使用js中URLencode转码方法。包括将name、value中的空格替换为加号;将非ascii字符做百分号编码;将input的name、value用=
连接,不同的input
之间用&
连接,即:key=value&key=value
json
主要用来解析json样式
5.2.1 extended:true/false 区别
urlencoded
方法返回的对象是一个键值对,当extended
为false
的时候,键值对中的值就为String
或Array
形式,为true
的时候,则可为任何数据类型。false
:表示使用系统模块querystring来处理,也是官方推荐的true
:表示使用第三方模块qs来处理
6 express中间件
6.1 基本理解
中间件
:处理请求的,本质就是个函数,在 Express 中,对中间件有几种分类
- 当请求进来,会从第一个中间件开始进行匹配
- 如果匹配,则进来
- 如果请求进入中间件之后,没有调用 next 则代码会停在当前中间件
- 如果调用了 next 则继续向后找到第一个匹配的中间件
- 如果不匹配,则继续判断匹配下一个中间件 - 不关心请求路径和请求方法的中间件,也就是说任何请求都会进入这个中间件
- 中间件本身是一个方法,该方法接收三个参数:
Request
请求对象Response
响应对象next
下一个中间件
- 当一个请求进入一个中间件之后,如果不调用 next 则会停留在当前中间件
- 所以
next
是一个方法,用来调用下一个中间件的 - 调用 next 方法也是要匹配的(
不是调用紧挨着的那个
)
app.use(function (req, res, next) {console.log('1')next()})app.use(function (req, res, next) {console.log('2')next()})
6.2 错误处理
- 当调用
next
的时候,如果传递了参数,则直接往后
找到带有四个参数
的应用程序级别中间件 - 当发生错误的时候,我们可以调用
next
传递错误对象 - 然后就会被全局错误处理中间件匹配到并处理之
app.get('/', function (req, res, next) {fs.readFile('.d/sa./d.sa/.dsa', function (err, data) {if (err) {next(err)}})
})
错误处理中间件
// 配置错误处理中间件
app.use(function (err, req, res, next) {res.status(500).send(err.message)
})
这篇关于NodeJS和Express框架的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!