通过express框架实现web服务器

express是基于node.js平台的web开发框架，对于node.js来说express是第三方模块，相当于中间件（中间件--是为了给用户提供更好的服务、可以方便的拆卸）。

接下来我们试着通过使用express来直接访问一个名叫publish的文件夹中的index.html文件。

首先我们建一个如下的目录结构

test
├── public
│   ├── css
│   │   └── index.css
│   ├── img
│   │   └── bg.png
│   └── index.html
└── serve.js     # 服务器

首先我在index.html和index.css中简单些一些内容

  
  
  
  
  



  你好,帅哥！！！
  

h1 {
  color: hotpink;
}

img {
  width: 900px;
}

然后我们需要通过npm把express这个框架下载到当前test这个根目录文件夹的下面

npm init --yes //初始化

npm install express //下载包

然后当包下载完成之后，就可以在serve.js中来写内容了

// 引入express
const express = require('express')

// 调用express()
const app = express()

// 设置请求对应的处理函数--静态托管public文件夹
app.use(express.static('public'))

// 监听端口号，启动web服务
app.listen(8080, function () {
  console.log('app listening on port 8080')
})

接下来，我们通过浏览器在地址栏输入localhost:8080就可以来访问publish中index.html中的内容

这时候我们vscode中的小黑窗口就相当于一个服务器，浏览器就相当于是客户端，我们通过一台电脑简单的模拟了，浏览器发送请求到web服务器，然后web服务器响应的一个全过程。