node.js

node:来解析 .js 文件的软件

浏览器内置了一个 js 代码的解释器(解析器),所以能识别 js 代码

官方: 是一个基于 Chrome V8 解析引擎的 JavaScript 运行时环境

node 的作用

+ 当 js 代码引入在 html 文件内, 在浏览器打开的时候,使用 ECMAScript 操作 BOM 和 DOM,叫前端 js

+ 当 js 代码直接被 node 运行的时候, 没有了 BOM 和 DOM,增加了一些操作你电脑的能力,如:操作文件 文件夹的增删改查,电脑系统,数据库,我们叫做 后端 js

node 环境的安装,官网下在安装包,直接装在你的电脑操作系统内部,需要通过 命令行 来打开node

node 运行 js 代码的方式

1. $ node:就会进入 js 编辑模式

2. $ node 文件名     在控制台 以 node 这个 "软件" 来运行 该 js 文件

一些简单的指令

$ dir: 查看当前目录下的有哪些文件或者文件夹存在

$ cd 文件夹名称: 切换到指定目录下

$ cd ..   : 回到当前目录的上一级目录

+ 注意: cd xx 的指令是不能进行盘符的切换的,只能在当前盘符下切换目录环境

$ 盘符: 切换盘符

$ md 文件夹名称: 创建文件夹

$ rmdir 文件夹名称: 删除文件夹

$ ipconifg: 查看你的电脑 ip 地址信息

$ systeminfo:查看你电脑的基本操作系统信息

$ cls/ $ clear(os): 清屏

node 的模块化开发

node 有自己的模块化开发标准, 叫 CommonJS 模块化开发标准

1. 自定义模块

2. 内置模块(分为内置模块fs、内置模块path、内置模块http)

3. 第三方模块(不是自己写的, 也不是内置模块)

+ require('指定的 js 文件')

=> 注意: 如果你导入的文件是 .js 后缀, 可以省略不写

+ 返回值: 该文件内导出的那个 对象数据类型

const moduleB = require('./b.js')

module.exports = { 书写上你要导出的内容 }

module.exports = {

  // 导出了一个叫做 num 的数据, 用的是我自己的 num 这个变量的值

  // 导出一个叫做 num 的数据, 值是 100

  num: num,

  showStr: fn

}

内置模块 - fs 模块

const fs = require('fs'), 用来操作 各种 文件和文件夹 的操作 

1. 异步读取文件内容

fs.readFile(文件路径, 格式, 回调函数)

-> 文件路径: 你要读取的文件路径, 如果该路径不存在, 就会出现错误信息

-> 格式: 选填, 默认是 buffer, 选填 'utf-8'

-> 回调函数: 必填, 读取结束后执行

2. 同步读取文件内容

fs.readFileSync(文件路径, 格式)

如果读取文件失败, 会直接报错, 阻断程序的继续执行, 返回值: 读取到的文件内容

3. 异步写入文件内容

fs.writeFile(文件路径, 写入的内容, 回调函数)

文件路径: 你要写入的内容的文件路径, 如果该路径不存在, 会创建一个这个文件在写入

写入的内容: 你要想文件内写入的内容,写入是完全覆盖式的写入

回调函数: 必填, 写入完毕后执行的代码

4. 同步写入文件内容

fs.writeFileSync(文件路径, 写入的内容)

内置模块 - path 模块

用来操作 路径信息 的模块,用来组装路径信息的

const path = require('path')

1. path.join(路径片段1, 路径片段2, ...),返回值: 组装好的相对路径信息

2. path.resolve(路径片段1, 路径片段2, ...), 返回值: 组装好的装成一个绝对路径信息

内置模块 - http 模块

用来开启 http 服务的

const http = require('http')

http.createServer(函数),返回值: 是一个 服务

服务.listen(端口号, 函数), 此时你的命令行就变成了一个 服务器,根据不同的请求给出不同的响应

// 1. 导入 http 模块
const http = require('http')
const fs = require('fs')
//创建一个服务, 函数a 会在什么时候执行,只要前端有任何一个请求请求到了 8080 端口号, 就会执行一次
const server = http.createServer(function a(req, res) {
  const url = req.url
  const method = req.method
  if (method === 'GET' && url === '/test/first') {
    // response 内有一个方法叫做 end(),语法: res.end('文本内容'),后端返回给前端的内容
    res.end('hello world')
  }

  // 判断
  if (method === 'GET' && url === '/test/second') {
    const obj = { name: "jack", age: 18 }

    res.end(JSON.stringify(obj))
  }
  if (method === 'GET' && url === '/goods/list') {
    // 读取 data.json 文件
    fs.readFile('./data.json', 'utf-8', (err, data) => {
      if (err) return console.log(err)
      res.end(data)
    })
  }
})

// 2-2. 监听一个端口
server.listen(8080, () => console.log('我正在监听 8080 端口号'))

express

下载 express: $ npm install express

下载 art-template(提供模板引擎解析语法):$ npm install art-template

下载 express-art-template(让 atr-template 和 express 合作): $ npm install express-art-template

const express = require('express')

// 创建服务
const app = express()

// 配置服务的静态资源
app.use('/public', express.static('./client'))

// 配置文件读取引擎(需要用到 expres-art-template)
app.engine('html', require('express-art-template'))

// 配置所有文件的处理
app.use('/page', (req, res) => {
  const path = req.url.slice(1)

  // 利用 express-art-template 提供的 res.rander 方法 去读取指定的文件内容
  // 注意: 文件需要放在 views 文件夹内
  res.render(path, { title: '啥都有 首页', list: [ 100, 200, 300, 400, 500 ] })
})

// 监听一个指定的端口号
app.listen(6060, () => console.log('监听 6060 端口号成功了'))

// 去到命令行, 用 node 执行当前文件

使用express处理静态资源

// 使用 express 框架搭建一个服务器
const express = require('express')
const fs = require('fs')

// 1. 创建服务
// 语法: express()
// 返回值: 一个服务
const app = express()

// 配置所有静态资源文件
// 我们把所有静态资源约定一个共同点, 当你需要静态资源文件的时候, 请求都以 /public 开头
//  将来前端需要 css/index.css 文件的时候, 就请求 /public/css/index.css
app.use('/public', express.static('./client'))

// 配置各种内容
// 目前已后端为主, 设计了一个 /a, 返回的是 index.html 文件
// 当前端需要 index.html 文件的时候, 请求 /a
// 这个是一个随便书写的内容, 完全没有语义化
// 既然可以自己定义, 修改成 /index.html
app.use('/index.html', function (req, res) {
  fs.readFile('./client/index.html', 'utf-8', (err, data) => {
    if (err) return console.log(err)

    res.end(data)
  })
})

// 既然 index.html 可以成功
// 那么我们就可以把 xxx.html 放在一起书写
// 我们还可以把 xxx.css 放在一起书写
// 我们还可以把 xxx.js 放在一起书写
// 我们还可以把 xxx.jpg 放在一起书写
// ...

// 我们可以把上面的内容分成两类
// 1. 页面文件(html)
// 2. 静态资源(css, js, 图片)
// express 框架给我们提供了一个叫做 static 的方法
//   专门用来处理静态资源文件的
// 语法: express.static('文件夹名称')
// 作用: 按照你写的文件夹去自动查找内容自动帮你返回给前端


// 2. 监听一个端口
// 语法: 服务.listen(端口号, 回调函数)
app.listen(8080, () => console.log('监听8080 端口成功'))

/*
  // 将来只要前端发送 /public/xxx 的请求
  // 都会去到 ./client 文件夹下查找文件, 自动返回
  app.use('/public', express.static('./client'))

  // 例子:
  // 前端请求 /public/css/index.css
  // 拿到 /public 后面的内容, 也就是 /css/index.css
  // 和 ./client 组合在一起, 得到 ./client/css/index.css
  // 自动读取 ./client/css/index.css 文件, 返回给前端

  // 前端请求 /public/js/index.js
  // 拿到 /public 后面的内容, 也就是 /js/index.js
  // 和 ./client 组合在一起, 得到 ./client/js/index.js
  // 自动读取 ./client/js/index.js 文件, 返回给前端

  // 前端请求 /aaa/css/index.css
  // 不会去按照 static 规则定义了
*/

 nodemon 工具

+ nodemon 和 node 差不对, 是一个专门用来执行 js 文件的工具,依赖 node 环境运行

+ 特点: 当文件发生变化的时候, 会自动重启

下载 nodemon:

因为依赖 node 环境,就可以使用 npm 下载

=> win : $ npm install --global nodemon

=> MAC : $ sudo npm install --global nodemon

检测下载: $ nodemon --version

卸载

win : $ npm uninstall --global nodemon

MAC : $ sudo npm uninstall --global nodemon

使用:

和使用 node 运行 js 文件是一样的

+ 打开命令行, 切换目录到你要执行的 js 文件的目录: $ nodemon 文件名称

基础路由

const express = require('express')
const app = express()
// 配置服务的静态资源
app.use('/public', express.static('./client'))

// 配置文件读取引擎(需要用到 expres-art-template)
app.engine('html', require('express-art-template'))

// 配置所有文件的处理
app.use('/page', (req, res) => {
  const path = req.url.slice(1)

  // 利用 express-art-template 提供的 res.rander 方法 去读取指定的文件内容
  // 注意: 文件需要放在 views 文件夹内
  res.render(path, { title: '啥都有 首页', list: [ 100, 200, 300, 400, 500 ] })
})


// 判断你请求了什么内容, 我给出对应过得结果
// 两个基础语法
//   app.get('请求地址', 处理函数)
//   app.post('请求地址', 处理函数)
app.get('/aaa', (req, res) => {
  // res.end 只能返回一个 字符串 类型
  // const obj = {
  //   code: 1,
  //   message: '登录成功'
  // }
  // // 为了能把 obj 传递回去
  // // 需要 把 obj 转换成 字符串
  // // josn 格式
  // const str = JSON.stringify(obj)
  // res.end(str)
  // 当你使用 express 的时候, express 为你提供了一个方法叫做 send()
  // 你可以向里面填写任意数据类型, express 会自动判断你的数据类型, 决定要不要帮你转换成 字符串
  // res.send('hello world')

  res.send({ code: 1, message: '注册成功' })
})

app.post('/login', (req, res) => {
  // 拿到前段传递来的数据, 进行数据库比对, 告诉他登录成功失败

  res.send({
    code: 1,
    message: '我接收到你用 post 发送的 /login 请求了'
  })
})