Spring Boot和Vue跨域请求问题原理解析
这篇文章主要介绍了Spring Boot和Vue跨域请求问题原理解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
使用Spring Boot + Vue 做前后端分离项目搭建,实现登录时,出现跨域请求
Access to XMLHttpRequest at "http://localhost/open/login" from origin "http://localhost:8080" has been blocked by CORS policy: No "Access-Control-Allow-Origin" header is present on the requested resource.
Vue中使用的Axios,配置main.js文件
Axios.defaults.baseURL = "http://localhost:80" Axios.defaults.headers["Content-Type"] = "application/x-www-form-urlencoded;charset=UTF-8" Axios.defaults.withCredentials = true
Spring Boot中重写WebMvcConfigurationSupport的方法addCorsMapping
import org.springframework.context.annotation.Configuration; import org.springframework.web.servlet.config.annotation.CorsRegistry; import org.springframework.web.servlet.config.annotation.WebMvcConfigurationSupport; @Configuration public class WebMvcConfig extends WebMvcConfigurationSupport{ @Override public void addCorsMappings(CorsRegistry registry) { String[] origins = {"http://localhost:8080"}; registry.addMapping("/**") .allowedOrigins(origins) .allowCredentials(true) .allowedMethods("*") .allowedHeaders("*") .maxAge(3600); } }
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持云海天教程。