如何判断请求是否发送成功以及获取请求中的数据

简介: 如何判断请求是否发送成功以及获取请求中的数据

一、如何判断请求是否发送成功


(这里咱以axios为例)


//获取按钮
 const btns = document.querySelectorAll('button');
 btns[1].onclick = function (){
    //调用axios方法(返回值是一个Promise对象),发送AJAx请求
    axios({
        //请求类型
        method: 'POST',
        //URL
        url:'http://localhost:3000/posts',
        //设置请求体(即数据)
        data:{
            title: "money",
            author: "i want"
        }
    }).then(response => {//请求成功后,获取请求中的数据
        console.log(response)
    })
};


(1)打开network,先查看请求码


image.png


(2)查看请求头和请求体

  • 查看请求方式、请求参数、请求协议
  • 请求实体(传输的数据)

1.png


二、获取请求中的数据

(这里咱依然是以axios为例,axios请求成功有一个then方法,调用then方法,打印一下请求的数据)


image.png


❀ 推荐一个本地服务端(器)的模拟:

(使用也非常简单npm或者其他方式安装一下,使用github介绍上那个简单的例子,然后通过命令启动服务端即可访问)

快速搭建http服务:https://github.com/typicode/json-server


3.png

4.png


目录
相关文章
|
缓存
POST 为什么会发送两次请求?
POST 为什么会发送两次请求?
846 0
|
Java 数据库 Maven
根据请求中接收到的主动协商头字段,目标资源没有用户代理可以接受的当前表示
今天使用ssm框架搭建了一个项目,测试一个插入的接口结果返回406,但是数据库插入成功了,报错406是因为返回的结果接口无法解析。
861 0
|
2月前
|
JSON 安全 前端开发
post为什么会发送两次请求?
post为什么会发送两次请求?
107 12
|
2月前
|
开发者
HTTP状态码是由网页服务器返回的三位数字响应代码,用于表示请求的处理结果和状态
HTTP状态码是由网页服务器返回的三位数字响应代码,用于表示请求的处理结果和状态
32 1
|
5月前
|
XML 安全 前端开发
post为什么会发送两次请求详解
【6月更文挑战第5天】在Web开发中,开发者可能会遇到POST请求被发送了两次的情况,
192 0
|
6月前
|
JSON 前端开发 JavaScript
关于我认识的请求方式
关于我认识的请求方式有三个
68 0
怎么修改请求的参数和响应
怎么修改请求的参数和响应
101 0
|
存储 负载均衡 JavaScript
一个请求过来都经过了什么
我面试人家的时候特别喜欢问一个问题:”请描述一下一个请求过来到响应完成都做了什么,越详细越好。” 对于一个高手来说,他只要回答好了这一个问题,技术面试就通过了。所以如果我要去面试,我就把这个问题的答案压缩到40分钟到1个小时。因为一般的技术面试都是这个时间段哒,虽然我其实很想讲上两天。哎,一看我们部门就是做业务的。 为了让人家听懂,我一般会设置一个业务场景。比如说:现在用户要开始上传一个视频。那么业务上要经过用户打开浏览器页面,用户点击[选择视频文件]按钮,JS端调用系统本地文件选择器,JS端将视频信息写入到浏览器页面,用户点击[开始上传],此时开始发送请求。
一个请求过来都经过了什么