前后端交互跨域问题的解决方案

摘要

---

跨域问题 在前后端交互的时候，会经常出现，对于这种问题，前端和后端都有自己的解决方式；

问题复现

---

上面出现的问题：前端项目在端口号为8080上部署的，后端项目是在端口号为8181上部署的，如果没有相应的跨域请求的处理，就会出现CORS跨域的问题。

解决方案

---

• 后端解决：

解决方法：

在服务端只需要编写一个类，这个类来实现一个接口，重写接口的方法，就可以解决跨域问题。

1. 创建一个CrosConfig类 ，随便一个什么类都可以，没有名字要求。

2. 让CrosConfig类实现WebMvcConfigurer接口。

3. 重写 WebMvcConfigurer 接口中 addCorsMapping(CorsRegistry registry) 方法。
   

   @Configuration
   public class CrosConfig implements WebMvcConfigurer {
       @Override
       public void addCorsMappings(CorsRegistry registry) {
           registry.addMapping("/**")
                   .allowedOrigins("*")
                   .allowedMethods("GET","HEAD","POST","DELETE","OPTIONS")
                   .allowCredentials(true)
                   .maxAge(3600)
                   .allowedHeaders("*");
       }
   }
   // 对于方法中一些参数的设置，这里不做解释，自己可以稍微百度一下。
   

解决结果：

总结

对于跨域问题还有好多解决的方式，对于跨域问题怎么出现的？一些原理性的没有介绍，这个网上都有介绍，大家可以去百度一下。因为我是做后端开发的，在开发过程中遇到了这个问题，所以就提供后端 的解决方式。