自适应和响应式网站网站优化网站优化

1. 什么是跨域

从不同的地址访问另外一个地址就是跨域

2.跨域一定会有异常吗

跨域异常只会在前端发生，后端跨域不会产生异常
因为浏览器有一个叫做同源策略的东西，它发现不同域之间的访问是不安全的行为，会禁止，所以会抛出异常

3.五种解决跨域的方式

1. 跨域请求JSONP

前端配置

$.agax({url：’http://localhost:8080/cors/jsonp/1’，dataType:"jsonp",//jsonp:'a',不指定默认callback//jsonpCallback:"cc",不指定自动生产type:'GET',success:function(){alert(result.data);}});

后端配置：

@GetMapp("cors/jsonp/{id}")
public JSONObject getUser(@PathVariable Integer id,String callback){User user=new User("xushu","jsonp");return new JSONPObject(callback,new Resule<>(200,"SUCCESS",user))
}

好处：兼容各种浏览器
弊端：前端端都需要配置-耦合度高

2. 跨域请求cors【单一】

注意：需要用到@CrossOrigin注解

前端配置

$.agax({url：’http://localhost:8080/cors/1’，type:'GET',success:function(){alert(result.data);}});

后端配置：

@GetMapp("cors/{id}")
@CrossOrigin("http://localhost:8081")
public JSONObject getUser(@PathVariable Integer id){User user=new User("xushu","jsonp");return new Resule<>(200,"SUCCESS",user)；
}

注解：只支持单一的接口

3. 跨域请求cors【批量】

注意：后端需要实现WebMvcConfigurer

后端配置：

public class MyWebMvcConfigurer implements WebMvcConfigurer{@Overridepublic void addCorsMappings(CorsRegistry registry){registry.addMapping("user/*")//配置那些接口可以跨域.allowedOrigins("http://localhost:8080")//配置那些来源有权跨域.allowedMethods("GET","POST","DELETE","PUT");//配置运行跨域访问方法};
}

4. 跨域请求cors【所有】

注意：后端需要配置过滤器

后端配置：

@Configuration
public class MyCorsFilter{//@Beanpublic CorsFilter corsFilter(){//1.创建CORS配置对象CorsConfiguration config=new CorsConfiguration();//支持域名config.addAllowedOriginPattern("*");//是否发送cookieconfig.setAllowCredentials(true);//支持请求方式config.addAllowedMethod("*");//添加地址映射UrlBasedCorsConfigurationSource corsConfigurationSource=new UrlBasedCorsConfigurationSource ();corsConfigurationSource.registerCorsConfiguration("/**",config);//返回corsFilter对象return new CorsFilter(corsConfigurationSource);}
}

优缺点：

优点：前端不需要写代码就可以支持，主要靠服务器进行配置**
缺点：IE浏览器不能低于IE10,浏览器一旦发现AJAX请求跨域，就会自动添加一些附加的头信息，有时还会多出一次附加的请求，但用户不会有感觉【option请求】

5.nginx 反向代理