学习Node


起步

官网:

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

文章作者:
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 !
  目录