常见跨域解决方案

目前常见的跨域解决方案

• Jsonp
  最早的解决方案，利用script标签可以跨域的原理实现
  限制：

1. 需要服务的支持
2. 只能发起GET请求

• nginx反向代理
  思路是：利用nginx反向代理吧跨域为不跨域，支持各种请求方式
  缺点：需要在nginx进行额外配置，语义不清晰
• CORS
  规范化的跨域请求解决方案，安全可靠
  优势：

1. 在服务端进行控制是否进行跨域，可自定义规则
2. 支持各种请求方式
   缺点
3. 会产生额外的请求
   现在大部分使用cors方式解决跨域
   CORS是一个W3C标准，全程是“跨资源共享”。他允许浏览器向跨源服务器同事支持，发起XmlHttpRequest请求，从而客服AJAX只能同源使用的限制。CORS需要浏览器和服务起同时支持。目前，所有的浏览器都支持该功能，IE浏览器不能低于IE10。

浏览器端：所有浏览器都支持该功能（IE10以下不可以）。整个cors通信过程，都是浏览器自动完成不需要用户参与。

服务端：CORS通信和AJAX没有任何差别，因此不需要改变以前的业务逻辑，只不过，浏览器会在请求中携带一些头信息，我们需要以此判断是否运行其跨域，然后在响应头加入一些信息即可，这一般通过过滤器完成就可以了。
例如：

package com.leyou.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;

/**
 * @author li
 * @time:2018/8/7
 * 处理跨域请求的过滤器
 */
@Configuration
public class GlobalCorsConfig {
    @Bean
    public CorsFilter corsFilter() {
        //1.添加CORS配置信息
        CorsConfiguration config = new CorsConfiguration();

        //1) 允许的域,不要写*，否则cookie就无法使用了
        config.addAllowedOrigin("http://manage.leyou.com");
        config.addAllowedOrigin("http://www.leyou.com");
        //2) 是否发送Cookie信息
        config.setAllowCredentials(true);
        //3) 允许的请求方式
        config.addAllowedMethod("OPTIONS");
        config.addAllowedMethod("HEAD");
        config.addAllowedMethod("GET");
        config.addAllowedMethod("PUT");
        config.addAllowedMethod("POST");
        config.addAllowedMethod("DELETE");
        config.addAllowedMethod("PATCH");
        // 4）允许的头信息
        config.addAllowedHeader("*");

        //2.添加映射路径，我们拦截一切请求
        UrlBasedCorsConfigurationSource configSource = new UrlBasedCorsConfigurationSource();
        configSource.registerCorsConfiguration("/**", config);

        //3.返回新的CorsFilter.
        return new CorsFilter(configSource);
    }
}