ajax跨域问题小结
跨域:跨域名的访问,是浏览器对ajax的一种限制,这样可以有效的防止跨站攻击
跨域的范畴: 域名不同 或 端口不同 或 二级域名不同
解决方案:
第一种:由于前端基础薄弱,且该方式老掉牙,不讲解;
第二种:利用nginx的反向代理,使得我们表面发送不跨域的请求,实际代理了跨域,配置nginx相关配置即可;
第三种:CORS,规范化的跨域请求解决方案,在服务端进行控制是否允许跨域;
详解:浏览器会将ajax请求分为两类,其处理方案略有差异:简单请求、特殊请求。
简单请求:
请求方法为 : head get post
Http的头信息不能超过以下几种字段:Accept Accept-Language Content-Language Last-Event-ID Content-Type
当浏览器发现发现的ajax请求是简单请求时,会在请求头中携带一个字段:Origin,
该字段指出当前请求属于哪个域(协议+域名+端口),允许跨域否由服务器决定
如果服务器允许跨域,需要在返回的响应头中携带下面信息
Access-Control-Allow-Origin: http://manage.hahaha.com //可接受的域,是一个具体域名或者*,代表任意
Access-Control-Allow-Credentials: true //是否允许携带cookie,默认情况下,cors不会携带cookie,除非这个值是true
Content-Type: text/html; charset=utf-8
如果跨域请求要想操作cookie,需要满足3个条件:
服务的响应头中需要携带Access-Control-Allow-Credentials并且为true。
浏览器发起ajax需要指定withCredentials 为true
响应头中的Access-Control-Allow-Origin一定不能为*,必须是指定的域名
复杂请求:
请求方式: put
浏览器先询问服务器,发起预检请求,当前网页所在的域名是否在服务器的许可名单之中,
以及可以使用哪些HTTP动词和头信息字段。只有得到肯定答复,浏览器才会发出正式的XMLHttpRequest
请求
java实现: 服务端可以通过拦截器统一实现,SpringMVC已经帮我们写好了CORS的跨域过滤器:CorsFilter
@Configuration
public class GlobalCorsConfig {
@Bean
public CorsFilter corsFilter() {
//1.添加CORS配置信息
CorsConfiguration config = new CorsConfiguration();
//1) 允许的域,不要写*,否则cookie就无法使用了
config.addAllowedOrigin("http://manage.hahaha.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);
}
}
摘自--某某笔记
ajax跨域问题小结的更多相关文章
- AJAX跨域调用相关知识-CORS和JSONP(引)
AJAX跨域调用相关知识-CORS和JSONP 1.什么是跨域 跨域问题产生的原因,是由于浏览器的安全机制,JS只能访问与所在页面同一个域(相同协议.域名.端口)的内容. 但是我们项目开发过程中,经常 ...
- JQuery.Ajax + 跨域 (crossDomain) + POST + JSON + WCF RESTful, 5大陷阱和解决方案
JQuery.Ajax + 跨域 (crossDomain) + POST + JSON + WCF RESTful, 5大陷阱和解决方案 最近在开发WSS RESTful服务的时候, 碰到了这些个纠 ...
- Ajax跨域问题及解决方案
目录 复现Ajax跨域问题 Ajax跨域介绍 Ajax跨域解决方案 一. 在服务端添加响应头Access-Control-Allow-Origin 二. 使用JSONP解决 小结 复现Ajax跨域问题 ...
- ajax跨域访问总结
1,jsonp的使用 就是script引用别的站点js,利用回调把内容传给这个js。 a需要引入b,在页面上引入b的js,里面有b的函数,在a中执行,就能拿到json了。 程序B中test.js的代码 ...
- java、ajax 跨域请求解决方案('Access-Control-Allow-Origin' header is present on the requested resource. Origin '请求源' is therefore not allowed access.)
1.情景展示 ajax调取java服务器请求报错 报错信息如下: 'Access-Control-Allow-Origin' header is present on the requested ...
- Ajax跨域问题及解决方案 asp.net core 系列之允许跨越访问(Enable Cross-Origin Requests:CORS) c#中的Cache缓存技术 C#中的Cookie C#串口扫描枪的简单实现 c#Socket服务器与客户端的开发(2)
Ajax跨域问题及解决方案 目录 复现Ajax跨域问题 Ajax跨域介绍 Ajax跨域解决方案 一. 在服务端添加响应头Access-Control-Allow-Origin 二. 使用JSONP ...
- Laravel中的ajax跨域请求
最近接触Laravel框架ajax跨域请求的过程中遇到一些问题,在这里做下总结. 一开始发起ajax请求一直报500错误,搜索相关资料后发现Laravel要允许跨域请求可以加入Cors中间件,代码如下 ...
- Ajax操作如何实现跨域请求 (JSONP和CORS实现Ajax跨域的原理)
由于浏览器存在同源策略机制,同源策略阻止ajax (XMLHttpRequest) 从一个源加载的文档或脚本获取或设置另一个源加载的文档的属性. 特别的:由于同源策略是浏览器的限制,所以请求的发送和响 ...
- Ajax跨域问题的两种解决方法
浏览器不允许Ajax跨站请求,所以存在Ajax跨域问题,目前主要有两种办法解决. 1.在请求页面上使用Access-Control-Allow-Origin标头. 使用如下标头可以接受全部网站请求: ...
随机推荐
- Java 8 方法引用
转自:https://www.runoob.com/java/java8-method-references.html 方法引用通过方法的名字来指向一个方法. 方法引用可以使语言的构造更紧凑简洁,减少 ...
- 数据库设计,表与表的关系,一对一。One-To-One(1)
如何处理对象间one-to-ont的映射关系:one-to-one: 处理一对一关联的方式有两种: 1.主键关联使用主键关联处理一对一的关系. 主键关联不需要额外的表字段:两行是通过这种一对一关系相关 ...
- tesseract编译错误:fatal error: allheaders.h: No such file or directory
错误描述: globaloc.cpp::: fatal error: allheaders.h: No such file or directory #include "allheaders ...
- MFC---关于string.h相关函数
1.在VS2005中使用strcpy.strcat.sprintf出现如:mfc中'strcpy' was declared deprecated警告 这是因为VS2005中认为CRT中的一组函数如果 ...
- 了解各种不同意义上的new
问题1:请说明new operator 和 operator new的差异? 1.new operator : 一般我们写代码的时候,例如:String *p = new String(&quo ...
- cdnbest如何在站点里开启强制缓存
在站点设置中如下图设置: 强制缓存有两种方式,一种是文件类型,一种是url方式
- Java获取工程目录
背景:程序执行时,会涉及到去读取配置文件等操作,那就需要了解怎么获得文件路径 Java目录映射关系 说明一点:在Java代码执行时,会将编译生成的classes文件,以及配置文件等信息生成到tar ...
- Python练习-生成器、迭代器-2018.12.01
如果列表元素可以按照某种算法推算出来,可以在循环的过程中不断推算出后续的元素.这样就不必创建完整的list,从而节省大量的空间.在Python中,这种一边循环一边计算的机制,称为生成器:generat ...
- (O)WEB:前端网站性能优化(原创)
*从理论.实战编码.实战调试3个方面学习前端性能优化(包括页面加载时间和页面流畅度): -------------------------------理论----------------------- ...
- sendmail发送邮件
#echo 'hello!' | mail -s "hello test" 119733@qq.com