Node.js

前提引入

javascript
变量
数据类型
循环
分支
判断
函数
this
作用域
DOM BOM
基于XMLHttpRequest的ajax

浏览器的javascript解析引擎
Chrome V8
DOM API
BOM API
AJAX API

  1. 浏览器提供了内置的api,然后我们进行调用
  2. 浏览器中的javascript运行环境
    • v8 引擎 解析执行code
    • 内置api 提供特殊的接口

javascript依靠node也可以做后端

node 后端运行环境

what is Node.js
JavaScript runtime built on Chorme v8 javascript engine
基于v8 引擎的javascript运行环境

注意

  1. 浏览器是javascript 的前端运行环境
  2. Node.js是JavaScript的后端运行环境
  3. Node.js 中无法调用DOM和BOM等浏览器内置api

Node.js what do ?

快速构建Web应用 …

学习路径：javascript基础语法+Node.js内置api模块(fs,path,http)+第三方api模块(express、mysql)

Node.js安装

node

LTS 稳定版


Current 新特性

node 模块

模块加载机制

  1. 优先从缓存中加载
  2. 内置模块的加载优先级最倒
  3. 在加载模块时，如果没有执行./或../ 则node 会把它当做内置模块或第三方模块进行加载
  4. 在导入模块时，如果没有加扩展名，node会按照顺序加载文件
    • 按照确切的文件名加载
    • 补全.js扩展名
    • 补全.json扩展名
    • 补全.node 扩展名
    • 加载失败
  5. 第三方模块加载机制
    从当前的父目录开始，如果没有找到第三方模块，逐级向上寻找指导根目录
  6. 目录作为模块
    • package.json 指向main方法指向的.js文件
    • 没有package.json文件加载index.js

自定义模块

fs 文件系统模块

1
2
3
const fs = require('fs')
fs.readFile()
fs.writeFile()

path 路劲模块

1
2
3
const path=require('path')
path.join()
path.basename()

作用域

向外共享模块作用域中的成员

1
module.exports //将模块内的成员共享出去，供外界使用

最终以module.exports为准
为了不发生混乱要么使用exports或module.exports之一

node.js中的模块规范化

  1. CommonJs规定了模块的特性和各模块之间如何相互依赖
  2. 加载某个模时，其实是加载该模块的module.exports属性，require()方法用于加载模块

npm包

  1. node.js第三方模块又叫包
  2. 基于内置模块封装
  3. 包和内置模块类似于JQuery和浏览器内置API之间的关系

安装包

1
2
3
4
npm install 包名
npm i 报名
#安装指定版本
npm i @xx.xx.x

包管理配置文件

package.json

在执行命令所在的目录中，快速新建package.json 文件


1
npm init -y

npm包管理工具会自动把包管理名称和版本号记录在package.json中

当node_modules文件夹被删除后

1
2
3
// 一次性安装package.json中的所用包或指定的包
npm i
npm i 包名

卸载包
1
npm uninstall 包名

如果某些包只在开发中使用上线后不会用到

  • 将该包放到devDependencies 节点中
    1
    2
    3
    npm i 包名 -D
    // 或
    npm i 包名 --save-dev

如果某些包在开发和上线后都会用到

  • 将该包放到dependencies 节点中
    1
    npm i 包名 --save

解决包下载包慢问题

  • 默认国外

使用国内镜像

1
2
3
4
淘宝npm镜像
 ·搜索地址：http://npm.taobao.org/
           https://registry.npmmirror.com/
 ·registry地址：http://registry.npm.taobao.org/

1
2
3
cnpmjs镜像
 ·搜索地址：http://cnpmjs.org/
 ·registry地址：http://r.cnpmjs.org/

1
2
3
4
5
6
# 查看当前下包镜像源
npm config get registry
# 切换镜像为淘宝镜像
npm config set registry=http://registry.npm.taobao.org/
# 检查镜像源是否配置成功
npm config get registry

永久配置

1
npm config set registry https://registry.npm.taobao.org

还原配置
1
2
# https://registry.npmjs.org/
npm config set registry https://registry.npmjs.org/

淘宝npm镜像站全新上线，Web界面地址：https://npmmirror.com；npm 客户端使用地址：https://registry.npmmirror.com/

nrm

快速查看和切换下包镜像源

1
2
3
4
5
6
# 通过npm包管理器，将nrm安装为全局可用工具
npm i nrm -g
# 查看所有可用镜像源
nrm ls
# 下载包镜像源切换为taobao
nrm use taobao

包的分类

项目包分为两类:

  • 开发依赖包 (devDependencies 结点中的包，只在开开发期间用到)
  • 核心依赖包 (dependencies 结点中的包，在开发期间和项目上线都会用到)

全局包
我的
D:\nodejs\node_global\node_modules

1
2
3
# 安装全局包 -g
npm i [package_name] -g
npm install [package_name] -g

判断是否要安装全局包看官方文档

包的分类

1
2
3
4
# 将i5ting_toc安装为全局包
npm install -g i5ting_toc
# 调用i5ting_toc 轻松实现md转html的功能
i5ting_toc -f 要转换的.md文件路径 -o

发布自己的包

  1. 先在npm官网注册账号，让后在终端执行以下
    npm官网
  2. 发布前看一看npm镜像是不是官方的镜像若不是则要切换过来（切换为官方镜像） 
    1
    2
    3
    nrm ls # 查看所有镜像
    npm config get registry # 查看当前镜像
    nrm use xxx(镜像名)  # 切换镜像

  3. 切换后执行以下

    1
    2
    3
    4
    5
    6
    7
    8
    9
    PS D:\Web前端学习\NodeJsStudy> npm login
    Username: lang1210  # 用户名
    Password:     # 密码（会被隐藏）
    Email: (this IS public) 2933129083@qq.com  #电子邮件
    npm notice Please check your email for a one-time password (OTP)
    # 输入npm 发来的邮件里的OPT code (这里是30736811 )
    Enter one-time password from your authenticator app: 30736811 
    # 成功后的结果
    Logged in as lang1210 on https://registry.npmjs.org/.

  4. 发布

    注意包名不能相同，发布前先在官网看一看有没有和自己同名的包

    切换到包的目录下执行

    1
    npm publish

    success

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    PS D:\Web前端学习\NodeJsStudy> cd .\alang-tools\
    PS D:\Web前端学习\NodeJsStudy\alang-tools> npm publish
    npm notice
    npm notice package: alang-tools@1.0.0
    npm notice === Tarball Contents ===  
    npm notice 364B  dist/01.test.dev.js       
    npm notice 535B  src/dist/dateFormat.dev.js
    npm notice 565B  src/dateFormat.js
    npm notice 727B  src/dist/htmlEscape.dev.js
    npm notice 831B  src/htmlEscape.js
    npm notice 1.2kB dist/index.dev.js
    npm notice 260B  index.js
    npm notice 226B  package.json
    npm notice 701B  README.md
    npm notice === Tarball Details ===
    npm notice name:          alang-tools
    npm notice version:       1.0.0
    npm notice package size:  2.1 kB
    npm notice unpacked size: 5.5 kB
    npm notice shasum:        682e3bfec7a63d51a9fbab0916468a754fdfec43
    npm notice integrity:     sha512-OdnieY0Ir5lxS[...]MfyyyJfVi/n/Q==
    npm notice total files:   9
    npm notice
    + alang-tools@1.0.0

  5. 删除包

    1
    npm unpublish 包名 --force

    注意

    (1) 只能删除72小时内发布的包
    (2) 删除的包，在24小时之内不允许重复发布
    (3) 要慎重，不要发没意义的包（练练手可还行）

express

官方文档

  1. express基于内置http模块封装得到（提高开发效率）
  2. 类似于Web Api和Jquery 的关系
  3. 能做什么
    • Web网站服务器
    • API 接口服务器
  4. 安装
    npm install express --save
  5. 创建web服务器
  6. 托管静态资源
    • express.static
  7. 自动启动项目（修改代码后不需重启）
    nodemon test.js
  8. 路由
    客户端请求与服务端处理函数之间的额映射关系
    路由匹配

模块化路由

不挂载在app上

  1. 创建路由.js文件
  2. 调用express.Router()
  3. 向路由对象上挂载具体的路由
  4. 使用module.exports()向外分享路由对象
  5. 使用app.use()函数注册路由模块

中间件

中间件函数的形参列表中，必须包含next参数

1
2
3
app.get('/',function(req,res,next){
    next()
})

实现对某个中间件连续调用的关键，它表示把流转关系转交给下一个中间件或路由
中间件

  • 路由之前定义中间件
  • 调用next()之后不能写其他的代码
  • 应用级别的中间件绑定到了app上，路由级别的中间件绑定到了router上
  1. 错误级别的中间件在路由之后
  2. express 内置中间件
    1
    2
    3
    express.static()
    express.json()
    express.urlencode({extend:false})

静态资源管理

路由匹配

ExpressApi

接口跨域问题 access-control-allow-
  • origin
  • header
  • methods
    res.setOrigin()
    ser.setHeader()
使用cors中间件
  1. npm instll cors
  2. const cors=require(‘cors’)
  3. app.use(cors())
简单请求和预检请求
简单请求1次
预检请求2次

|  简单请求     |  预检请求   |
| :---        |    :----:   | :----:| 
| 客户端与服务器      | 1      |2 (OPTION成功之后)|
| 类别  | post get        | delete header|
JSONP

mysql 数据库操作

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// 安装mysql包
npm i mysql
// 导入
const mysql = require('mysql')
// 连接
const conn = mysql.createPool({
    host: '127.0.0.1',
    port: 3306,
    user: 'root',
    password: 'password',
    database: 'databaseName'
})
// 操作
conn.query(sql, [params1,params2...],(err, results) => {
    if (err) return console.log(err.message);
})

Web开发模式

  1. 前后端分离
    • 前端UI
    • 后端API
  2. 根据具体业务场景
    • 良好SEO，服务器渲染（企业级网站）
    • 交互性好，不考虑SEO，前后端分离（后台管理）

前后端的身份认证（token,jwt）

  1. 身份认证
    • 服务端渲染
      • Session 认证机制
    • 前后端分离
      • JWT认证机制

Session认证机制

前后端分离模式

  1. 后端提供 api，前端通过 ajax 调用接口的开发模式
  2. 减轻服务端的压力

  3. 不利于 seo,因为完整的 html 页面在客户端动态拼接完成，所以爬虫无法爬取页面的有效信息（但可通过 vue,react 的 ssr 解决）

  4. 服务端渲染 session 认证

  5. 前后端分离 jwt 认证
  1. 自动发送、域名独立、过期时间、4KB 限制

session

  1. 通过 session 在服务端生成 cookie
  2. session 使用

jwt 认证机制

  1. 目前最流行的跨域认证解决方案
    用户的信息通过 Token 字符串的形式，保存在客户端浏览器中，服务器通过还原 Token 字符串的形式来认证用户身份
  2. jwt 组成：header,Payload,Signature(格式用逗号分隔：header.Payload.Signature)

  3. 每部分的含义

    • payload 部分才是真正的用户信息，它是用户信息经过加密后生成的字符串
    • header 和 signature 是安全相关的部分，只是为了保证 Token 的安全

  4. 客户端收到服务器发送的 JWT 后通常将他存储在 loaclStorage 或 sessionStorage 中

  5. JWT 放在 http 请求头的 Authoriaztion 中（Authorization: Bearer <token>）
  6. express 中使用 jwt

express-jwt文档
jsonwebtoken文档

  1. 加密(jsonwebtoken)解密(express-jwt)将 jwt 字符串还原为 json 对象的 secret 密钥