跨域:跨域名的访问,是浏览器对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跨域问题小结的更多相关文章

  1. AJAX跨域调用相关知识-CORS和JSONP(引)

    AJAX跨域调用相关知识-CORS和JSONP 1.什么是跨域 跨域问题产生的原因,是由于浏览器的安全机制,JS只能访问与所在页面同一个域(相同协议.域名.端口)的内容. 但是我们项目开发过程中,经常 ...

  2. JQuery.Ajax + 跨域 (crossDomain) + POST + JSON + WCF RESTful, 5大陷阱和解决方案

    JQuery.Ajax + 跨域 (crossDomain) + POST + JSON + WCF RESTful, 5大陷阱和解决方案 最近在开发WSS RESTful服务的时候, 碰到了这些个纠 ...

  3. Ajax跨域问题及解决方案

    目录 复现Ajax跨域问题 Ajax跨域介绍 Ajax跨域解决方案 一. 在服务端添加响应头Access-Control-Allow-Origin 二. 使用JSONP解决 小结 复现Ajax跨域问题 ...

  4. ajax跨域访问总结

    1,jsonp的使用 就是script引用别的站点js,利用回调把内容传给这个js。 a需要引入b,在页面上引入b的js,里面有b的函数,在a中执行,就能拿到json了。 程序B中test.js的代码 ...

  5. 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 ...

  6. 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 ...

  7. Laravel中的ajax跨域请求

    最近接触Laravel框架ajax跨域请求的过程中遇到一些问题,在这里做下总结. 一开始发起ajax请求一直报500错误,搜索相关资料后发现Laravel要允许跨域请求可以加入Cors中间件,代码如下 ...

  8. Ajax操作如何实现跨域请求 (JSONP和CORS实现Ajax跨域的原理)

    由于浏览器存在同源策略机制,同源策略阻止ajax (XMLHttpRequest) 从一个源加载的文档或脚本获取或设置另一个源加载的文档的属性. 特别的:由于同源策略是浏览器的限制,所以请求的发送和响 ...

  9. Ajax跨域问题的两种解决方法

    浏览器不允许Ajax跨站请求,所以存在Ajax跨域问题,目前主要有两种办法解决. 1.在请求页面上使用Access-Control-Allow-Origin标头. 使用如下标头可以接受全部网站请求: ...

随机推荐

  1. HTTP协议规定,客户端的编写

    HTTP协议是网络应用层协议,建立在TCP/IP协议基础上.HTTP协议基于客户/服务器模式,客户端主动发出HTTP请求,服务器接收HTTP请求,返回HTTP响应结果.HTTP协议对HTTP请求,以及 ...

  2. 如何配置IIS使其支持APK文件的下载

    在管理工具里打开Internet 信息服务(IIS)管理器.然后选择需要配置的网站. 右侧的界面中会显示该网站的所有功能配置,我们选择并点击进入“MIME类型” 在左侧的操作区选择点击“添加”MIME ...

  3. Ubuntu下解决MySQL自启动,chkconfig list 全部off 情况

    chkconfig命令是用于RedHat/Fedora发行版的,而对于像Ubuntu之类的Debian发行版,应该使用这个命令: sudo update-rc.d mysql defaults 验证一 ...

  4. 微信H5支付 遇到坑的一些解决方法

    解决办法 1. 商家参数格式有误,请联系商家解决 a.对于前后端分离的开发模式 前端发起请求 服务端请求微信h5支付统一下单接口 返回参数mweb_url 给前端 然后前端调起微信h5支付 b.注意的 ...

  5. Codeforces Round #508 (Div. 2)

    Codeforces Round #508 (Div. 2) http://codeforces.com/contest/1038 A #include<bits/stdc++.h> us ...

  6. 【mac上安装&配置&使用git】

    转自:https://www.jianshu.com/p/7edb6b838a2e 目录 安装git 创建ssh key.配置git 提交本地项目到GitHub 一.安装Git MAC 上安装Git主 ...

  7. 515. Find Largest Value in Each Tree Row查找一行中的最大值

    [抄题]: You need to find the largest value in each row of a binary tree. Example: Input: 1 / \ 3 2 / \ ...

  8. centos7 smplayer 安装 安装视频播放器

    # yum -y install http://li.nux.ro/download/nux/dextop/el7/x86_64/nux-dextop-release-0-5.el7.nux.noar ...

  9. android nostra13

    nostra13的ImageLoader可以让图片能在异步加载更加流畅,可以显示大量图片,在拖动ListView的时候不会出现卡的现象.可以实现ListView的图片加载.GridView的图片加载. ...

  10. CentOS_mini下make安装

    执行make时显示: make: *** No targets specified and no makefile found. Stop. 用网上的教程: wget http://ftp.gnu.o ...