前端提交post请求却变成get请求的原因及解决方法

1,354 阅读2分钟

导语:笔者在vue2项目中,使用axios封装post请求,提交请求时却变成get请求

1. 错误写法

export function login(data){
    return service.request({
        url:'/user/login',
        methods: "post",
        data:data,
    })
}

2. 错误原因

编写登录方法时,把method敲成methods,而且又看到了提示就直接使用了(太粗心😭)

image.png

Axios 中文文档 ] 改成如下代码即可

export function login(data){
    return service.request({
        url:'/user/login',
        method: "post",
        data:data,
    })
}

3. POST请求变成了GET请求的原因

· 浏览器的默认请求模式是GET

当我们在浏览器地址栏中输入一个网址或单击链接时,浏览器会发送一个GET请求来获取该网页的内容。GET是HTTP协议中最常用的一种请求方法,用于获取服务器上的资源,例如文本、图片、视频等。由于GET方法是幂等的,即在相同的请求下,不会对服务器上的资源状态产生副作用,因此它更适合用于读取和获取资源。但是,如果需要修改服务器上的资源,例如添加、更新或删除数据,则需要使用其他请求方法,如POST、PUT、DELETE等。

4. POST请求变成了GET请求如何解决

检查请求的URL是否正确,确保POST请求发送到了正确的URL上

检查请求是否包含正确的请求头(如Content-Type),以确保请求正文的格式正确

检查服务器是否正确处理了请求,并返回了正确的响应。如果服务器返回HTTP 400 Bad

Request响应,浏览器可能会将POST请求转换为GET请求

如果在JavaScript代码中使用了AJAX来发送POST请求,请确保代码正确设置了请求方法和请求正文