通过express框架实现web服务器

stars满天繁星

已于 2022-04-29 18:55:12 修改

阅读量2.7k

点赞数 3

分类专栏： node.js 文章标签：前端 javascript node.js

于 2022-04-28 20:42:00 首次发布

本文链接：https://blog.csdn.net/qq_64454072/article/details/124481853

版权

node.js 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

什么是express？

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

托管静态资源-web服务器

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

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

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

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

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" href="./css/index.css">
</head>

<body>
  <h1>你好,帅哥！！！</h1>
  <img src="./img/bg.png" alt="">
</body>

</html>

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服务器响应的一个全过程。

stars满天繁星

关注

3
点赞
踩
2

收藏

觉得还不错? 一键收藏
3
评论
通过express框架实现web服务器

什么是express？express是基于node.js平台的web开发框架，对于node.js来说express是第三方模块，相当于中间件（中间件--是为了给用户提供更好的服务、可以方便的拆卸）。托管静态资源-web服务器接下来我们试着通过使用express来直接访问一个名叫publish的文件夹中的index.html文件。首先我们建一个如下的目录结构test├── public│ ├── css│ │ └── index.css│ ├── img│ ...
复制链接

扫一扫