这是我参与更文挑战的第2天,活动详情请查看:更文挑战

HTTP

规定了浏览器和万维网夫为妻之间互相通信的规则约定

请求报文

给服务器发的内容

请求行

请求类型: GET/POST 参数: 一个url 协议版本: HTTP/1.1

请求头

HOST: atguigu.com Cookie: name=guigu Content-type: application/x-www-form-urlencoded User-Agent: chrome 83

空行

请求体

GET时为空 POST可以不为空例如POST时 username=admin&password=admin

响应报文

服务器传回的结果

行

协议版本 HTTP/1.1
响应状态码 200
响应字符串 OK 响应字符串与状态码对应

头

Content-Type: Content-length: Content-encoding ... (对响应体内容做一些相关描述)

空行

体

主要返回的结果如返回html内容

...

express基础操作


// 引入express
const { request, response } = require('express')
const express = require('express')


// 创建应用对象
const app = express()


// 创建路由规则
// request 对请求报文的封装
// response 对响应报文的封装
// 当页面使用post对服务器进行请求时执行的代码c
app.get('/', (request, response)=>{
    // 设置响应
    response.send('hello express')
})

// 当页面使用post对服务器进行请求时执行的代码
app.post('/', (request, response)=>{
    // 设置响应
    response.send('hello express')
})

// 无论使用何种请求都执行这个
app.all('/', (request, response)=>{
    // 设置响应
    response.send('hello express')
})
// 监听端口启动更多服务
app.listen(8000,()=>{
    console.log("服务器已经启动, 8000端口监听中")
})

原生ajax

创建xhr对象

const xhr = new XMLHttpRequest()

设置请求类型与url

xhr.open('GET或POST','url')

发送请求

xhr.send('参数') 参数可以使用json格式利用&符号连接起来 xhr.send('a:1&b:2&c:3') 也可以使用等号 xhr.send('a=1&b=2&c=3') 直接发送数字 xhr.send("123124")

xhr部分属性

readyState 值:0 1 2 3 4 0 －（未初始化）还没有调用send()方法 1 －（载入）已调用send()方法，正在发送请求但尚未发送请求 2 －（载入完成）send()方法执行完成，请求已经发送完成 3 －（交互）接收到部分响应数据 4 －（完成）响应内容解析完成,已经接收到全部数据,，可以在客户端调用, 连接已经关闭
onreadystatechange 表示一个事件当readyState的值改变时,就触发这个事件 xhr.onreadystatechange = function() {..} 表示当readyState改变时, 触发onreadystatechange事件, 调用后面那个函数
status 即响应状态码 (200~299的数字都表示成功)
responseType xhr.responseType = 'json' 将服务器返回的内容作为json格式的对象, 以后使用xhr.response相当于一个对象, 因为一般服务器发回来的信息也是一个对象转化为字符串, 这样在ajax中可以直接使用对象而不需要再手动使用JSON.parse(xhr.response)进行转化

设置头部信息

在open方法后使用setRequestHeader('string1', 'string2') 第一个参数为头名字, 第二个为其值

Ajax