随着课程的进阶,后期会使用 Express
框架快速搭建 Node 页面,但现阶段为了更好的理解 Node.js ,将按照教程一步一步的由浅入深将文档整理出来
http 服务器和客户端
Node.js 提供了 http
模块,用于处理 http 服务,使用方式如下:
通过 require
引入 http 模块
var http = require('http') // 引入http组件模块
使用 http.createServer()
创建 Server 服务
var server = http.createServer()
server.on('request', callback(request, response))
绑定事件 request
,每次有请求时都会触发此事件
回调函数提供两个参数
* request 请求对象。用于访问响应状态、消息头、以及数据
* response 访问对象。由 HTTP 服务器在内部创建, 它作为第二个参数传给 `request` 事件
启动 HTTP 服务器监听连接
server.listen('端口号', () => {...})
此时要注意 端口号设定范围 0 ~ 65536
用法实例如下:
var http = require('http') // 引入http组件模块
var server = http.createServer()
server.on('request', (req, res) => {
var url = req.url // 获取当前请求的url
res.setHeader('Content-Type', 'text/html; charset=utf-8') // 解决中文乱码问题
if (url == '/') {
res.write('这里是首页') // 返回数据内容
res.end() // 结束请求
} else if (url.indexOf('/public/') == 0) { // 开放 public 文件目录
res.end('需返回的数据')
res.write + res.end() 的简写为 res.end('需返回的数据')
} else {
console.log('404')
}
// 重定向
// res.statusCode = 302
// res.setHeader('Location', '/')
})
server.listen(2020, function () {
console.log('启动成功')
})
此时浏览器预览页面的路径为 http://localhost:
+ 端口号/
+ 页面路径
当访问 http://localhost:2020/
时,终端会显示 '启动成功'
但由于 request
事件中 res.end()
并没有返回数据,页面会呈现假死状态
通过 res.write()
可以书写需返回给客户端的数据
最后通过 res.end()
结束请求,若请求无结束,则页面会始终处于假死状态
-
res.write('返回数据内容')
+res.end()
可以简写为res.end('返回数据内容')
-
若
res.end()
返回数据中若存在中文,则在前台页面浏览时会导致乱码,通过添加请求头可解决此问题res.setHeader('Content-Type', 'text/html; charset=utf-8')
利用 req.url
可以获得页面路径,使用 if
对路径进行匹配,即可达成不同路径返回不同数据内容
- 默认情况下无法访问站点目录下静态文件,此时需要将所有静态文件放置于同一文件目录,之后判断路由路径即可达到开放对应目录静态资源的目的
req.url.indexOf('/public/') == 0
每次修改 node 文件后,都需要在 cmd 端重启服务器(至少现阶段暂时需要这样)
res.statusCode
用于对页面的重定向处理,在之后的博文中会有实例说明
art-template 模板引擎
art-template 是一个简约、超快的模板引擎
它采用作用域预声明的技术来优化模板渲染速度,从而获得接近 JavaScript 极限的运行性能,并且同时支持 Node.js 和浏览器
安装
npm install art-template --save // 简写 npm i art-template -S
用法
介绍一下教程中涉及的 art-template 部分用法,更多 API 还望参考 [art-template 高性能 JavaScript 模板引擎]
-
标准语法
{{ value }} {{ data.key }} {{ data['key'] }} {{ a ? b : c }} {{ a || b }} {{ a + b }}
-
条件
{{ if value }} ... {{ /if }} {{ if v1 }} ... {{ else if v2 }} ... {{ /if }}
-
循环
{{ each target }} {{ $index }} {{ $value }} {{ /each }}
使用实例
var template = require('art-template') // 引入 art-template 组件
var html = template.render('hi, {{ value }}.', {
value: 'aui'
});
// 最终输出 ‘hi, aui.’
template.render(source, data, options)
编译并返回渲染结果
- source 需导出的模板字符串
- data 需要替换到模板字符串中的数据对象
文章已同步我的个人博客:《Node学习笔记 http.createServer、art-template》
相关文章:
资料参考:
本篇文章由一文多发平台ArtiPub自动发布