起步
官网:
https://nodejs.org/en/
检查安装版本
node --version
Node.js既不是语言,也不是框架,它是一个平台。Node.js 中的 JavaScript没有 BOM、DOM,提供了一些服务器级别的 API:文件操作的能力、http 服务的能力。
helloworld.js
var f = 'hello nodejs'
console.log(f)
然后执行
node .../helloworld.js
require
是一个方法,它的作用就是用来加载模块的。在 Node 中,模块有三种:具名的核心模块,例如 fs、http;用户自己编写的文件模块;第三方模块。
读和写文件
浏览器中的 JavaScript 是没有文件操作的能力的,但是 Node 中的JavaScript 具有文件操作的能力。fs 是 file-system 的简写,就是文件系统的意思,fs.readFile
就是用来读取文件的。
node执行下面的js文件:
var fs = require('fs')
// 第一个参数就是要读取的文件路径,第二个参数是一个回调函数
fs.readFile('./data/hello.txt', function (error, data) {
if (error) {
console.log('读取文件失败了')
} else {
console.log(data.toString())
}
})
写文件:
var fs = require('fs')
fs.writeFile('./data/你好.md', '我是Node.js', function (error) {
if (error) {
console.log('写入失败')
} else {
console.log('写入成功了')
}
})
http服务
简单的http服务
var http = require('http')
//使用 http.createServer() 方法创建一个 Web 服务器
var server = http.createServer()
//当客户端请求过来,就会自动触发服务器的 request 请求事件,然后执行第二个参数:回调处理函数
server.on('request', function () {
console.log('收到客户端的请求了')
})
//绑定端口号,启动服务器
server.listen(3000, function () {
console.log('服务器启动成功了,可以通过 http://你的ip/ 来进行访问')
})
处理请求,request请求事件处理函数,需要接收两个参数:Request 请求对象,请求对象可以用来获取客户端的一些请求信息,例如请求路径;Response 响应对象,响应对象可以用来给客户端发送响应消息。
var http = require('http')
var server = http.createServer()
server.on('request', function (request, response) {
console.log('收到客户端的请求了,请求路径是:' + request.url)
// response 对象有一个方法:write 可以用来给客户端发送响应数据,write 可以使用多次,但是最后一定要使用 end 来结束响应,否则客户端会一直等待
response.write('hello')
response.write(' nodejs')
response.end()
})
server.listen(3000, function () {
console.log('服务器启动成功了,可以通过 http://你的ip:3000/ 来进行访问')
})
根据不同请求路径返回不同数据:
var http = require('http')
var server = http.createServer()
server.on('request', function (req, res) {
console.log('收到请求了,请求路径是:' + req.url)
console.log('请求我的客户端的地址是:', req.socket.remoteAddress, req.socket.remotePort)
var url = req.url
if (url === '/') {
res.end('index page')
} else if (url === '/login') {
res.end('login page')
} else if (url === '/products') {
var products = [{
name: '苹果 X',
price: 8888
},
{
name: '菠萝 X',
price: 5000
},
{
name: '小辣椒 X',
price: 1999
}
]
res.setHeader('Content-Type', 'text/plain; charset=utf-8')
// 响应内容只能是二进制数据或者字符串、 数字、 对象、数组、布尔值
res.end(JSON.stringify(products))
} else {
res.end('404 Not Found.')
}
})
server.listen(3000, function () {
console.log('服务器启动成功,可以访问了。。。')
})
在服务端默认发送的数据,其实是 utf8 编码的内容,中文操作系统默认是 gbk。在 http 协议中,Content-Type 就是用来告知对方我给你发送的数据内容是什么类型
// text/plain 就是普通文本
res.setHeader('Content-Type', 'text/plain; charset=utf-8')
// 如果你发送的是 html 格式的字符串,则也要告诉浏览器我给你发送是 text/html 格式的内容
res.setHeader('Content-Type', 'text/html; charset=utf-8')
// 图片就不需要指定编码了,因为我们常说的编码一般指的是:字符编码
res.setHeader('Content-Type', 'image/jpeg')
模板引擎
读取文件目录
var fs = require('fs')
fs.readdir('D:/Movie/www', function (err, files) {
if (err) {
return console.log('目录不存在')
}
console.log(files)
})
art-template
不仅可以在浏览器使用,也可以在 node 中使用。
https://github.com/aui/art-template
https://aui.github.io/art-template/
安装:该命令在哪执行就会把包下载到哪里,下载到 node_modules 目录中。
npm install art-template
注意:在浏览器中需要引用 lib/template-web.js 文件
浏览器中使用art-template:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>浏览器中使用art-template</title>
</head>
<body>
<script src="node_modules/art-template/lib/template-web.js"></script>
<script type="text/template" id="tpl">
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<p>大家好,我叫:{{ name }}</p>
<p>我今年 {{ age }} 岁了</p>
<h1>我来自 {{ province }}</h1>
<p>我喜欢:{{each hobbies}} {{ $value }} {{/each}}</p>
</body>
</html>
</script>
<script>
var ret = template('tpl', {
name: 'Jack',
age: 18,
province: '北京市',
hobbies: [
'写代码',
'唱歌',
'打游戏'
]
})
console.log(ret)
</script>
</body>
</html>
在 Node 中使用 art-template 模板引擎。在需要使用的文件模块中加载 art-template,只需要使用 require 方法加载就可以了:require('art-template')
node执行js
var template = require('art-template')
var fs = require('fs')
fs.readFile('./tpl.html', function (err, data) {
if (err) {
return console.log('读取文件失败了')
}
var ret = template.render(data.toString(), {
name: 'Jack',
age: 18,
province: '北京市',
hobbies: [
'写代码',
'唱歌',
'打游戏'
],
title: '个人信息'
})
console.log(ret)
})
tpl.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{ title }}</title>
</head>
<body>
<p>大家好,我叫:{{ name }}</p>
<p>我今年 {{ age }} 岁了</p>
<h1>我来自 {{ province }}</h1>
<p>我喜欢:{{each hobbies}} {{ $value }} {{/each}}</p>
<script>
var foo = '{{ title }}'
</script>
</body>
</html>
留言板小案例
npm
官网
https://www.npmjs.com/
常用命令行工具
//查看版本
npm --version
//升级npm
npm install --global npm
//跳过向导,快速生成
npm init -y
//只下载
npm install 包名
//下载并且保存依赖项(package.json文件中的dependencies选项)
npm install --save
//只删除,如果有依赖项依然保存
npm uninstall 包名
//依赖也删除
npm uninstall --save 包名
//帮助
npm help
解决翻墙:
首先安装淘宝cnpm(可以再任意目录执行,–global表示安装到全局)
npm install --global cnpm
接下来用cnpm替换npm。
如果不想安装npm又想使用淘宝镜像:
npm install jquery --registry=https://registry.npm.taobao.org
加入配置文件中:
npm config set registry https://registry.npm.taobao.org
//查看配置成功
npm config list