1、前后端连接请求方式:
- 请求方式分为:get、post、put、patch、delete
- get方式:偏向获取数据;
- post方式: 偏向向后端提交数据;
- put方式:偏向更新(全部更新);
- patch方式:偏向部分修改;
- delete方式:偏向删除信息;
2、get方式和后端交互的步骤:
<script>
//向后端发请求
//1.创建对象XHR 用new创建,new XMLHttpRequest
let xhr = new XMLHttpRequest()
//2.配置 open(请求方式、请求地址、是否异步)
xhr.open("GET","http://localhost:5500/ajax/1.JSON")
//3.发送请求 send()
xhr.send()
//4.接收数据,注册事件
//方法一:事件readystatechange
xhr.onreadystatechange = function(){
if(xhr.readyState===4 && /^2\d{2}$/.test(xhr.status)){
console.log("数据解析完成",JSON.parse(xhr.responseText))
}else if(xhr.readyState===4 && xhr.status===404){
console.error("没有找到这个页面")
}
}
//方法二:事件load
// xhr.onload = function(){
// if(/^2\d{2}$/.test(xhr.status)){
// console.log("数据解析完成",JSON.parse(xhr.responseText))
// }else if(xhr.status===404){
// console.error("没有找到这个页面")
// }
// }
</script>
3、post方式
因为我们要向后端要数据,但是我们现在没有后端,所以我们就自己创建一个json文件,基于这个json文件来创建一个后端模拟接口,和后端要数据,这个数据就是这个json文件,创建方法见:
基于json文件创建后端模拟接口_陌一一的博客-CSDN博客
现在这个json文件就是模拟是后端给的数据,用post请求方式的话;
要实现的需求是:用post方式向后端接口:http://localhost:3000/user发送数据,json文件现在模拟的是数据库,当我们给后端发送一条数据时,后端把它存在数据库中(也就是这里的json文件),然后后端返回json格式的数据给我们;
post方式因为是要向后端发送数据的,所以post请求