Node.js入门到企业Web开发中的应用

发表于 | 分类于 | 评论数： | 阅读次数：
本文字数： 2.8k | 阅读时长 ≈ 7 分钟

前言

本文是个人对慕课网《Node.js入门到企业Web开发中的应用》的图文总结。

NodeJS是什么

  1. a JS runtime built on Chrome’s V8
  2. event driven, non-blocking I/O model

为什么偏爱NodeJS

  1. CPU密集 VS IO密集
  2. web常见场景
    • 静态资源读取
    • 数据库操作
    • 渲染页面
  3. 高并发
  4. 集群 VS 分布式

CommonJS

  • CommonJS
    • require支持.js/.json/.node，不写拓展名则依次尝试
    • require特性
      • module加载时会执行代码块，加载后缓存
    • global全局对象
      • process
        • argv
        • argv0
        • execArgv
        • execPath
        • env
        • nextTick
      • timeout
        • setImmediate

环境调试

  1. chrome调试(断点)
  2. IDE调试

基础API

path

  • normalize/join/resolve
  • basename/extname/dirname
  • parse/format

Buffer

1
2
3
4
5
6
7
8
9
10
11
12
13
Buffer.alloc()
Buffer.allocUnsafe()
Buffer.from()
Buffer.byteLength()
Buffer.isBuffer()
Buffer.concat()
buf.length
buf.toString()
buf.fill()
buf.equals()
buf.indexOf()
buf.copy()
// 还有string_decoder内置依赖包(解决中文字符乱码)

events

  1. 监听事件：on/once
  2. 分发事件：emit
  3. 移除事件：removeListener/removeAllListeners

fs

1
2
3
4
5
6
7
8
9
10
11
fs.readFile()
fs.writeFile()
fs.stat() // 可用于判断文件是否存在
fs.rename()
fs.unlink()
fs.readdir()
fs.mkdir()
fs.rmdir()
fs.watch()/watchFile()
fs.createReadStream()
fs.createWriteStream()

promisify

1
2
3
const promisify = require('util').promisify;
const fs = require('fs');
const readFile = promisify(fs.readFile);

项目实战

项目初始化

  1. .gitignore
  2. .npmignore
  3. .editorconfig
  4. ESLint
  5. pre-commit(npm依赖包)
    用于在开发者commit前添加必须执行的git钩子函数，一般和eslint搭配校验用户代码是否符合规范，否则无法提交commit。

搭建本地静态资源服务器

  1. supervisor(npm依赖包)
    与nodemon作用类似，用于热加载http服务器。
  2. html模板引擎(如handlebars)
    用于在node发送response响应前，构建html模板。
  3. 响应类型(MIME type)
  4. 压缩(gzip/deflate)

  5. 范围请求(range + curl命令行)
    请求特定范围的数据，方法是在request里设置对应的header信息。
    request range: bytes=[start]-[end]
    response Accept-Ranges: bytes
    response Content-Range:bytes start-end/total

    使用curl工具来在命令行中请求指定range的数据。
    例如：
    1、curl -I 127.0.0.1
    参数-I代表查看响应头部信息
    2、curl -r 0-10 -i 127.0.0.1
    参数-i代表查看响应头和响应体，-r代表范围查看

  6. 缓存

打包成CLI工具

  1. commander(npm依赖包)
  2. yargs(npm依赖包)

发布到NPM上

本地构建项目

  • 本地构建项目
    • gulp
      • del
      • gulp-less
      • gulp-autoprefixer
      • gulp-clean-css
    • babel
      • presets
      • plugins
    • webpack
      • ExtractTextWebpackPlugin
        • 作用：将原本打包后内联嵌入的css样式独立成单独的.css文件。
      • Externals
        • 作用：对某些想通过script标签引入的依赖，不想一起打包到bundle.js里的情况，可以使用externals来排除。
      • CommonsChunkPlugin
        • 作用：剥离共用的依赖包。
      • Tree Shaking
        • 作用：按需打包，即打包时忽略依赖包中未用到的代码，减小打包后的体积。
        • 注意：
        • 1、该功能要求源码中必须使用import和export才有效。
        • 2、如果使用了babel（如babel-preset等），则要禁用babel中对module的转换。
        • 3、如果依赖包具有副作用（sideEffects），则需要在package.json中添加sideEffects属性。
          • 4、开启mode: production生产模式。

测试

单元测试

  • 断言库
    1. NodeJS自带的assert
    2. chai
  • 测试框架
    1. mocha
    2. jest
  • 测试工具
    • istanbul(测试覆盖率)
      用法：
      1
      2
      3
      npm install --save-dev 
      // package.json/script
      "cover": "istanbul cover _mocha test/mocha.js"

持续集成

性能测试

  • 含义：比较不同工具函数间处理的效率。
  • 工具
    • benchmark.js
    • jsPerf.com

UI测试

  1. enzyme
    作用：用于测试React的UI组件是否渲染正确。

  2. sinon
    作用：用于测试React组件的各类事件是否正确执行。

web浏览器自动化测试

  • selenium webdriver

爬虫

反爬虫

  • User-Agent & Referer & 验证码
  • 单位事件访问次数、访问量
  • 关键信息使用图片混淆（背景图片）
  • 异步加载

    爬虫工具

  • cheerio
    作用：将html字符串转换为对象。

  • puppeteer
    作用：模拟用户在浏览器中的行为，并捕获相关信息。

0%