1.什么是跨域?

  跨域是指从一个域名的网页去请求另一个域名的资源。比如从www.baidu.com 页面去请求 www.google.com 的资源。跨域的严格一点的定义是:只要 协议,域名,端口有任何一个的不同,就被当作是跨域

2.为什么浏览器要限制跨域?

  原因就是安全问题:如果一个网页可以随意地访问另外一个网站的资源,那么就有可能在客户完全不知情的情况下出现安全问题。比如下面的操作就有安全问题:

  1. 用户访问www.mybank.com ,登陆并进行网银操作,这时cookie啥的都生成并存放在浏览器
  2. 用户突然想起件事,并迷迷糊糊地访问了一个邪恶的网站 www.xiee.com
  3. 这时该网站就可以在它的页面中,拿到银行的cookie,比如用户名,登陆token等,然后发起对www.mybank.com 的操作。
  4. 如果这时浏览器不予限制,并且银行也没有做响应的安全处理的话,那么用户的信息有可能就这么泄露了。

3.为什么要跨域?

  既然有安全问题,那为什么又要跨域呢? 有时公司内部有多个不同的子域,比如一个是location.company.com ,而应用是放在app.company.com , 这时想从 app.company.com去访问 location.company.com 的资源就属于跨域。

4.实现跨域需要的技术手段。

  1.JSONP或者CORS

5.SpringMVC通过CORS实现跨域

  5.1定义一个Filter

package cn.ucmed.baseline.d2d.api.filter;

import org.springframework.web.filter.OncePerRequestFilter;

import javax.servlet.FilterChain;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException; public class CorsFilter extends OncePerRequestFilter {
@Override
protected void doFilterInternal(HttpServletRequest request, HttpServletResponse response, FilterChain filterChain) throws ServletException, IOException { if (request.getHeader("Access-Control-Request-Method") != null && "OPTIONS".equals(request.getMethod())) {
// CORS "pre-flight" request
response.addHeader("Access-Control-Allow-Origin", "*");
response.addHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
response.setHeader("Access-Control-Allow-Headers", "x-requested-with");
response.addHeader("Access-Control-Max-Age", "1800");//30 min
}
//This will filter your requests and responses.
filterChain.doFilter(request, response);
}
}

  5.2在web.xml中配置这个filter

<filter>
<filter-name>allowedAccessFilter</filter-name>
<filter-class>cn.ucmed.baseline.d2d.api.filter.CorsFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>allowedAccessFilter</filter-name>
<url-pattern>/registeryuyue/*</url-pattern>
</filter-mapping>

6.SpringBoot通过CORS实现跨域

package cn.ucmed.otaku;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.boot.autoconfigure.jdbc.DataSourceAutoConfiguration;
import org.springframework.boot.autoconfigure.orm.jpa.HibernateJpaAutoConfiguration;
import org.springframework.cloud.netflix.zuul.EnableZuulProxy;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.ImportResource;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter; @EnableZuulProxy
@SpringBootApplication(exclude = {
DataSourceAutoConfiguration.class,
HibernateJpaAutoConfiguration.class})
@ImportResource("classpath*:META-INF/spring/dubbo.xml")
public class GatewayApplication { public static void main(String[] args) {
SpringApplication.run(GatewayApplication.class, args);
} @Bean
public CorsFilter corsFilter() { final UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
final CorsConfiguration config = new CorsConfiguration();
config.setAllowCredentials(true);
config.addAllowedOrigin("*");
config.addAllowedHeader("*");
config.addAllowedMethod("OPTIONS");
config.addAllowedMethod("HEAD");
config.addAllowedMethod("GET");
config.addAllowedMethod("PUT");
config.addAllowedMethod("POST");
config.addAllowedMethod("DELETE");
config.addAllowedMethod("PATCH");
config.addExposedHeader("token");
source.registerCorsConfiguration("/**", config);
return new CorsFilter(source);
}
}

7.jquery $.ajax()跨域请求获取heads。

  ajax通过xhr.getAllResponseHeaders()能得到所有response headers,通过xhr.getResponseHeader('token')能获取到具体的head值,but,ajax跨域的请求getAllResponseHeaders()却怎么也获取不到全部的head值,只能获取到content-type这个head值,在http://stackoverflow.com/questions/15042439/cant-get-custom-http-header-response-from-ajax-getallresponseheaders终于找到了答案。需要在服务器端加 'Access-Control-Expose-Headers: header1,header2,header3'才能获取到header1,header2,header3

  $.ajax({
type: "get",
url: urlStr, //跨域的域名
data: transmitModel,
headers: {
notice_str: randomStr,
timestamp: timestamp,
sign: signStr
},
success: function(data, status, xhr) {
console.info(xhr.getAllResponseHeaders());
console.info(xhr.getResponseHeader('token'))
console.info(data);
console.info(status);
},
error: function(e) { },
complete: function() { } });

SpringMVC的Filter

public class CorsFilter extends OncePerRequestFilter {
@Override
protected void doFilterInternal(HttpServletRequest request, HttpServletResponse response, FilterChain filterChain) throws ServletException, IOException { if (request.getHeader("Access-Control-Request-Method") != null && "OPTIONS".equals(request.getMethod())) {
// CORS "pre-flight" request
response.addHeader("Access-Control-Allow-Origin", "*");
response.addHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
response.setHeader("Access-Control-Allow-Headers", "x-requested-with");
response.addHeader("Access-Control-Max-Age", "1800");//30 min
response.addHeader("Access-Control-Expose-Headers", "token");
}
//This will filter your requests and responses.
filterChain.doFilter(request, response);
}
}

SpringBoot的bean

  @Bean
public CorsFilter corsFilter() { final UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
final CorsConfiguration config = new CorsConfiguration();
config.setAllowCredentials(true);
config.addAllowedOrigin("*");
config.addAllowedHeader("*");
config.addAllowedMethod("OPTIONS");
config.addAllowedMethod("HEAD");
config.addAllowedMethod("GET");
config.addAllowedMethod("PUT");
config.addAllowedMethod("POST");
config.addAllowedMethod("DELETE");
config.addAllowedMethod("PATCH");
config.addExposedHeader("token");
source.registerCorsConfiguration("/**", config);
return new CorsFilter(source);
}

参考:

[1]博客,http://www.ruanyifeng.com/blog/2016/04/cors.html,跨资源共享CROS详解

[2]博客,http://blog.csdn.net/notechsolution/article/details/50394391,跨域与跨域访问

[3]博客,https://www.cnblogs.com/wwlhome/p/5787133.html,$.ajax应用之请求头headers

[4]博客,http://www.qdfuns.com/notes/17001/6df913ad0788f32e6908d70c849b7b8e.html,如何获取跨域请求的自定义response headers

CROS跨域请求处理的更多相关文章

  1. Vuex、axios以及跨域请求处理

    一.Vuex 1.介绍 vuex是一个专门为Vue.js设计的集中式状态管理架构. 对于状态,我们把它理解为在data中需要共享给其他组件使用的部分数据. Vuex和单纯的全局对象有以下不同: 1. ...

  2. WCF SOA --- AJAX 跨域请求处理 CORS for WCF

    一.问题        跨域请求无法处理的问题,由于为了阻止恶意的网站通过JS脚本来窃取正常网站受保护的资源.所由所有的浏览器的默认策略是阻止XmlHttpRequest的跨域的异步请求. 但是对于一 ...

  3. Jquery:ajax跨域请求处理

    昨天朋友想做个图片懒加载的效果,朋友是前端的,我这边给他提供数据,程序写好了放到服务器上,本地测试访问时却报jquery跨域的问题,于是找度娘了解了一下jquey如何处理,网上有很多参考文章,但没细看 ...

  4. Django 跨域请求处理

    参考https://blog.csdn.net/qq_27068845/article/details/73007155 http://blog.51cto.com/aaronsa/2071108 d ...

  5. Access-Control-Allow-Origin跨域请求处理

    今天在看新项目的时候,发现很多的   Controller 中都有一个 response.setHeader("Access-Control-Allow-Origin"," ...

  6. Springmvc ajax跨域请求处理

    上次给一个网站写网站  前后端分离 最后跪在ajax跨域上面了  自己在网上找了个方法  亲试可用  记录一下 写一个类  继承HandlerInterceptorAdapter package co ...

  7. cowboy跨域请求处理

    这几日在使用cowboy开发https服务器的过程中碰到几个问题,这里随手记录一下. 1)如果返回错误ERR_EMPTY_RESPONSE,那么可能是web服务器被关闭了. 2)如果返回错误ERR_C ...

  8. net core WebApi——文件分片上传与跨域请求处理

    目录 前言 开始 测试 跨域 小结 @ 前言 在之前整理完一套简单的后台基础工程后,因为业务需要鼓捣了文件上传跟下载,整理完后就迫不及待的想分享出来,希望有用到文件相关操作的朋友可以得到些帮助. 开始 ...

  9. flask之CORS跨域请求处理

    from flask import Flask from flask_cors import CORS#pip install Flask-CORS#跨域请求模块 app = Flask(__name ...

随机推荐

  1. jQuery 自带的动画效果

    1.方法: show:显示选中元素. hide:隐藏选中元素. toggle:显示或隐藏选中元素. fadeIn:将选中元素的不透明度逐步提升到100%. fadeOut:将选中元素的不透明度逐步降为 ...

  2. HDOJ/HDU 1297 Children’s Queue(推导~大数)

    Problem Description There are many students in PHT School. One day, the headmaster whose name is Pig ...

  3. iOS 切割图片

    - (UIImage *)CutImageWithImage:(UIImage *)image withRect:(CGRect)rect { //使用CGImageCreateWithImageIn ...

  4. 《你不知道的JavaScript》整理(六)——强制类型转换

    JavaScript中通常分为两种类型转换,"隐式强制类型转换"(implicit coercion)和"显式强制类型转换"(explicit coercion ...

  5. PHP实现登录注册

    一.首先实现一个PHP的简单登录注册的话 我们要简单的与后端定义一下接口和传输数据的方式 并且我们要有一个phpStudy服务器. 第一步:当我们点击注册按钮的时候数据库要接收到客户端请求的数据  第 ...

  6. 练习|Django-多表

    models.py from django.db import models # Create your models here. class Author(models.Model): nid = ...

  7. .net core项目初建

    电脑装Visual Studio2017,并升级版本.启动一个.net core 的项目. NET Core基本介绍 1.1 什么是ASP.NET Core ASP.NET Core 是一个全新的开源 ...

  8. [转帖]双剑合璧:CPU+GPU异构计算完全解析

    引用自:http://tech.sina.com.cn/mobile/n/2011-06-20/18371792199.shtml 这篇文章写的深入浅出,把异构计算的思想和行业趋势描述的非常清楚,难得 ...

  9. Jenkins构建时间Poll Scm的设置(常用设置)

    每15分钟构建一次:H/15 * * * *   或*/5 * * * * 每天8点构建一次:0 8 * * * 每天8点~17点,两小时构建一次:0 8-17/2 * * * 周一到周五,8点~17 ...

  10. Windows Server 2012怎样部署Domain Controller

    用过Windows Server2008 系统的运维师们,可能习惯于用dcpromo的方式部署Domain Controller,可是在WindowsServer2012操作系统已经把这样的部署方式取 ...