网站跨域的解决方法

最新推荐文章于 2024-10-17 22:00:13 发布

yxh13521338301

最新推荐文章于 2024-10-17 22:00:13 发布

阅读量327

点赞数 3

分类专栏： nginx 工作问题

本文链接：https://blog.csdn.net/yxh13521338301/article/details/105633764

版权

工作问题同时被 2 个专栏收录

41 篇文章 0 订阅

订阅专栏

nginx

6 篇文章 0 订阅

订阅专栏

源于蚂蚁课堂的学习，点击这里查看（老余很给力）

1.何为网站跨域

当一个项目发送ajax请求至另一个项目时，会出现请求成功但拿不到响应的情况，这是浏览器默认的安全策略。保证同源。
即：请求发起者和请求必须满足：同协议+同域名+同端口

2.解决方法

1.在每个请求对应的方法中手动设置响应头（繁琐，不推荐）
    // 设置允许跨域的域名，*表示允许所有
    response.setHeader("Access-Control-Allow-Origin", "*");

    或可以在nginx中统一设置请求头
    	server {
		    listen       80;
		    server_name  localhost;

	   

		    location / {
                ## 设置可跨域的域名为全部
			    add_header Access-Control-Allow-Origin *; 
			    root  D:\yxhData\staticData\cd-front;
			    #index  index.html index.htm;
		    }

	   
		    error_page   500 502 503 504  /50x.html;
		    location = /50x.html {
			    root   html;
		    }
	    }
    
    
2.在springboot2.0之后，可演变为统一配置（推荐）
    @Configuration
    public class CorsConfig {

        @Bean
        public CorsFilter corsFilter() {
            final UrlBasedCorsConfigurationSource urlBasedCorsConfigurationSource = new UrlBasedCorsConfigurationSource();
            final CorsConfiguration corsConfiguration = new CorsConfiguration();
            // 是否允许请求带有验证信息
            corsConfiguration.setAllowCredentials(true);
            // 允许访问的客户端域名
            corsConfiguration.addAllowedOrigin("*");
            // 允许服务端访问的客户端请求头
            corsConfiguration.addAllowedHeader("*");
            // 允许访问的方法名，如：GET
            corsConfiguration.addAllowedMethod("*");
            urlBasedCorsConfigurationSource.registerCorsConfiguration("/**", corsConfiguration);
            return new CorsFilter(urlBasedCorsConfigurationSource);
        }
    }

3.JSONP（不推荐）
    将ajax的dataType改为：jsonp，并设置回调函数，底层通过拼接随机参数发送get请求


4.HttpClient转发（不推荐）
    httpClient不会出现跨域问题，所以可以通过ajax请求本地方法，方法内部调用httpClient访问其他服务

5.nginx统一约定域名和端口（推荐）
    配置nginx的策略，使用项目名称去匹配对应的服务，统一域名和端口号，nginx反向代理查询

6.微服务网关统一配置（推荐）
    Zuul通过与Eureka的整合，实现了对服务实例的自动化维护，在使用服务路由配置时，不需要向传统路由配置方式那样
去指定具体的服务实例地址，只需要通过Ant模式配置文件参数即可

欢迎大家和帝都的雁积极互动，头脑交流会比个人埋头苦学更有效！共勉！

公众号：帝都的雁