H5W3
当前位置:H5W3 > JavaScript > 正文

vue.js axios跨域post请求400

项目是前后端分离,前端采用vue,后台用springboot2.x搭建
后台配置了跨域

@Configuration
public class MyCorsConfig implements WebMvcConfigurer {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins(ALL)
                .allowedMethods(ALL)
                .allowedHeaders(ALL)
                .allowCredentials(true)
                .maxAge(3600);
    }
}

前台get请求的跨域是正常的,但是在进行post请求时报400错误

后台控制器

    @PostMapping(value = "/login")
    public ResponseObject login(@RequestParam String username, @RequestParam String password){
        System.out.println(username);
        System.out.println(password);
        ...
    }

前台代码

this.$refs.loginFormRef.validate(async valid => {
        if (!valid) return
        const { data: res } = await this.$http.post('login', this.loginForm)
import axios from 'axios'
// 配置请求的跟路径
axios.defaults.baseURL = 'http://localhost:8088/'

// 在 request 拦截器中,展示进度条 NProgress.start()
axios.interceptors.request.use(config => {
  NProgress.start()
  return config
})
// 在 response 拦截器中,隐藏进度条 NProgress.done()
axios.interceptors.response.use(config => {
  NProgress.done()
  return config
})

···回复:

post请求 参数在body里


···回复:

400 是 HTTP 的状态码,主要有两种形式:

  • 1、bad request 意思是 “错误的请求”;
  • 2、invalid hostname 意思是 “不存在的域名”。

400 Bad Request 是由于明显的客户端错误(例如,格式错误的请求语法,太大的大小,无效的请求消息或欺骗性路由请求),服务器不能或不会处理该请求。

感觉是你请求的地址或者类型(GET/POST)不对,后端路由识别不出来。

 

本文地址:H5W3 » vue.js axios跨域post请求400

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址