1,步骤:
1.1 使用http 创建
① 导入 http 模块
② 创建 web 服务器实例
③ 为服务器实例绑定 request 事件,监听客户端的请求
④ 启动服务器
const http = require('http')//导入http
const server = http.createServer()//快速创建一个 web 服务器实例
server.on('request', function (req, res) {
console.log('Someone visit our web server.')
})//为服务器实例绑定 request 事件,即可监听客户端发送过来的网络请求
server.listen(80, function () {
console.log('server running at http://127.0.0.1')
})// 启动服务器
1.2 使用Express 模块创建
1.2.1,在项目文件夹安装
npm i express
1.2.2,创建基本的web服务器
//导入
const express = require('express')
//创建
const app =express()
//启动
app.listen(80,()=>{
console.log('http://locallhost:80')
})
1.2.3,监听GET 和 POST 请求
通过 app.get() 和app.post() 可以监听客户端的GET 和 POST 请求:
app.get('请求URL',function(req,res){
//请求处理函数
res.send()
console.log(req.query)
//req.query对象 可以访问到客户端通过查询字符串的形式,发送到服务器的参数
console.log( req.params)
//req.params 对象 可以访问到URL中,通过:匹配到的动态参数
})
app.post('请求URL',function(req,res){
//处理函数
res.send("请求成功")
//可以通过res.send() 方法,将处理好的内容发送给客户端
})
1.2.4,托管静态资源
express 提供了一个非常好用的函数,叫做 express.static(),通过它,我们可以非常方便地创建一个静态资源服务器, 例如,通过如下代码就可以将 public 目录下的图片、CSS 文件、JavaScript 文件对外开放访问了:
app.use(express.static('public'))
现在,你就可以访问 public 目录中的所有文件了
注意:Express 在指定的静态目录中查找文件,并对外提供资源的访问路径。 因此,存放静态文件的目录名不会出现在URL 中。
2,知识点:
req 请求对象
只要服务器接收到了客户端的请求,就会调用通过 server.on() 为服务器绑定的 request 事件处理函数。
如果想在事件处理函数中,访问与客户端相关的数据或属性,可以使用如下的方式:
server.on('request', (req) => {
// req.url 是客户端请求的 URL 地址
const url = req.url
// req.method 是客户端请求的 method 类型
const method = req.method
const str = `Your request url is ${url}, and request method is ${method}`
console.log(str)
})
res 响应对象
在服务器的 request 事件处理函数中,如果想访问与服务器相关的数据或属性,可以使用如下的方式:
server.on('request', (req, res) => {
// req.url 是客户端请求的 URL 地址
const url = req.url
// req.method 是客户端请求的 method 类型
const method = req.method
const str = `Your request url is ${url}, and request method is ${method}`
console.log(str)
res.end(str)
})
解决中文乱码问题
当调用 res.end() 方法,向客户端发送中文内容的时候,会出现乱码问题,此时,需要手动设置内容的编码格式:
server.on('request', (req, res) => {
// 定义一个字符串,包含中文的内容
const str = `您请求的 URL 地址是 ${req.url},请求的 method 类型为 ${req.method}`
// 调用 res.setHeader() 方法,设置 Content-Type 响应头,解决中文乱码的问题
res.setHeader('Content-Type', 'text/html; charset=utf-8')
// res.end() 将内容响应给客户端
res.end(str)
})