网站建设与管理的网页,站长工具域名备案查询,网站seo优化关键词,求做网站1. 什么是跨域
从不同的地址访问另外一个地址就是跨域
2.跨域一定会有异常吗
跨域异常只会在前端发生#xff0c;后端跨域不会产生异常 因为浏览器有一个叫做同源策略的东西#xff0c;它发现不同域之间的访问是不安全的行为#xff0c;会禁止#xff0c;所以会抛出异常…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 usernew 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 usernew 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 confignew CorsConfiguration();//支持域名config.addAllowedOriginPattern(*);//是否发送cookieconfig.setAllowCredentials(true);//支持请求方式config.addAllowedMethod(*);//添加地址映射UrlBasedCorsConfigurationSource corsConfigurationSourcenew UrlBasedCorsConfigurationSource ();corsConfigurationSource.registerCorsConfiguration(/**,config);//返回corsFilter对象return new CorsFilter(corsConfigurationSource);}
}优缺点
优点前端不需要写代码就可以支持主要靠服务器进行配置**
缺点IE浏览器不能低于IE10,浏览器一旦发现AJAX请求跨域就会自动添加一些附加的头信息有时还会多出一次附加的请求但用户不会有感觉【option请求】5.nginx 反向代理
