报错：跨域问题解决 No ‘Access-Control-Allow-Origin‘ header is present on the requested resource.

本是古典何须时尚 2021-09-25 03:52 203阅读 0赞

报错：

Access to XMLHttpRequest at 'http://127.0.0.1:8088/user/list' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
    xhr.js?b50d:178 GET http://127.0.0.1:8088/user/list net::ERR_FAILED

在学习前后端分离开发的过程中，遇到这个报错是非常正常的，当然也是比较好解决的问题，莫非就是`前端项目`使用了一个端口，`后端项目`使用了一个端口，但是其实同一个ip，但是不同端口之间也不能直接获取信息的，那么就要解决它。

先说一下情况，当前我是一个Spring Boot项目，版本是`2.x`版本。

想要更多了解的话，你可以看一下我三年前写的一篇文章，这样子解决也行，如果是自己学习的话：[SpringBoot+JSON+AJAX+ECharts+Fiddler实现前后端分离开发可视化（进阶篇）][SpringBoot_JSON_AJAX_ECharts_Fiddler]  
直接看菜单部分即可，通过软件进行端口转发，但这其实还是有点麻烦的，而且不够灵活。

在`Spring Boot`项目中，解决非常简单，新建一个配置类，然后用注解注入即可：

@Configuration
    public class CorsConfig implements WebMvcConfigurer { 
        public void addCorsMappings(CorsRegistry registry) { 
            registry.addMapping("/**")
                    .allowedOrigins("*")
                    .allowedHeaders(CorsConfiguration.ALL)
                    .allowedMethods(CorsConfiguration.ALL)
                    .allowCredentials(true)
                    .maxAge(3600); // 1小时内不需要再预检（发OPTIONS请求）
        }
    }

**重启项目**，就可以解决了！

当然，如果你还没解决，还有一个常见的错误，那就是，你前端的请求路径写错了，务必要小心！！！

--------------------

如果是`Spring Cloud`项目，使用的是`Gateway`网关，可直接在`GatewayApplication`加上以下内容即可：

@Bean
    	public CorsWebFilter corsFilter() { 
    		CorsConfiguration config = new CorsConfiguration();
    
    		config.setAllowCredentials(Boolean.TRUE);
    		config.addAllowedMethod("*");
    		config.addAllowedOrigin("*");
    		config.addAllowedHeader("*");
    		config.setMaxAge(3600L);
    
    		UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource(new PathPatternParser());
    		source.registerCorsConfiguration("/**", config);
    
    		return new CorsWebFilter(source);
    	}

加上了就可以删掉上面的 `CorsConfig`了，如果你有加了的话。

[SpringBoot_JSON_AJAX_ECharts_Fiddler]: https://blog.csdn.net/shaock2018/article/details/86736258

报错：跨域问题解决 No ‘Access-Control-Allow-Origin‘ header is present on the requested resource.

发表评论取消回复

还没有评论，来说两句吧...

相关阅读

相关快速解决跨域问题：No ‘Access-Control-Allow-Origin‘ header is present on the requested resource

相关 No 'Access-Control-Allow-Origin' header is present on the requested resource.'Ajax跨域访问解决方案

相关 Post request is No 'Access-Control-Allow-Origin' header is present on the requested resource跨域问题解决

相关完美解决Springboot跨域（No 'Access-Control-Allow-Origin' header is present on the requested resource）

相关 No 'Access-Control-Allow-Origin' header is present on the requested resource'，跨域访问的解决方法

相关跨域问题 No 'Access-Control-Allow-Origin' header is present on the requested resource

相关解决ajax中No ‘Access-Control-Allow-Origin‘ header is present on the requested resource跨域问题

相关报错：跨域问题解决 No ‘Access-Control-Allow-Origin‘ header is present on the requested resource.

相关解决 js ajax跨域访问报“No 'Access-Control-Allow-Origin' header is present on the requested resource.”错误

相关 ajax 跨域访问 No ‘Access-Control-Allow-Origin‘ header is present on the requested resource