跨域解决方案之二-->CORS解决跨域

最新推荐文章于 2024-03-05 18:28:35 发布

yuanfangfan

最新推荐文章于 2024-03-05 18:28:35 发布

阅读量442

点赞数

分类专栏： java 文章标签： java

java 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

前面简单介绍了JSONP解决跨域访问，顺便将看到的另一种跨域解决方案CORS（Cross-Origin Resource Sharing）即跨域资源共享作以简单介绍。

CORS，是一种服务器端的跨域解决方案，这种方案对于跨域的解决代码均在服务器端设置完成。在服务器端接收到客户端的请求后，通过获取到请求的来源站点Origin，如果愿意将资源共享给该站点，则通过设置“Access-Control-Allow-Origin”报头的值为请求的来源站点。浏览器接收到包含资源的响应后，会提取“Access-Control-Allow-Origin”响应报头的值，如果此值为*或者包含的源列表包含请求的源站点，则浏览器会允许JavaScript操作获取的资源；否则，不会操作获取的资源。

关于CORS解决跨域的相关理论可以参考CORS（跨域资源共享），在此处就不做深入介绍。主要介绍一下CORS的具体应用。

CORS解决跨域，是在后端做简单设置，下面是做的简单测试：

前端部署在http://localhost:8086/容器中，访问的url是http://localhost:8086/testWeb/testCORS.html，代码如下：

<span style="font-size:18px;"><!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript"  src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript"  src="js/jquery.easyui.min.js"></script>
<script type="text/javascript">
    $(function(){
        $.ajax({
            type : "get",
            url : "http://localhost:8080/testApp/testCORSServlet",
            dataType : "json",
            success : function(data) {//客户端jquery预先定义好的callback函数,
                //成功获取跨域服务器上的json数据后,会动态执行这个callback函数 
                alert(JSON.stringify(data));
            },
            error : function() {//数据加载失败
                alert("fail");
                error.apply(this, arguments);
            }
        });

    })
</script>
</head>
<body>
    this is the first page.....
</body>
</html></span>

后端使用servlet，部署在http://localhost:8080/下，

web.xml配置如下：

<span style="font-size:18px;"><?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
  <display-name>testApp</display-name>
  <welcome-file-list>
    <welcome-file>/testServlet</welcome-file>
    <welcome-file>index.htm</welcome-file>
  </welcome-file-list>
  <servlet>
     <servlet-name>testCORSServlet</servlet-name>
    <servlet-class>com.founder.servlet.TestCORSServlet</servlet-class>
  </servlet>
   <servlet-mapping>
    <servlet-name>testCORSServlet</servlet-name>
    <url-pattern>/testCORSServlet</url-pattern>
  </servlet-mapping>
</web-app></span>

TestCORSServlet代码如下：

<span style="font-size:18px;">package com.founder.servlet;

import java.io.IOException;
import java.util.HashMap;
import java.util.Map;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import net.sf.json.JSONObject;
/**
 * 测试CORSservlet
 */
public class TestCORSServlet extends HttpServlet {

    private static final long serialVersionUID = 1L;

    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp)
            throws ServletException, IOException {
        this.doPost(req, resp);
    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp)
            throws ServletException, IOException {
        Map<String,String> map=new HashMap<String,String>();
        map.put("name", "sherry");
        JSONObject json=JSONObject.fromObject(map);
        String s=json.toString();
        //start-CORS跨域设置
        String origin=req.getHeader("Origin");//得到请求页面所在站点
        if(origin!=null&&!origin.equals("null")){//跨域
            resp.setHeader("Access-Control-Allow-Origin", origin);//允许当前请求访问服务
            resp.setHeader("Access-Control-Allow-Credentials", "true");//设置服务端支持带用户凭证的请求，只有在服务端
        //显式支持用户凭证的情况下，携带了用户凭证的请求才会被认为是有效的
        }else{//当前域
            resp.setHeader("Access-Control-Allow-Origin", "*");
        }
        //end-CORS跨域设置
        System.out.print(origin);
        resp.getWriter().write(s);

    }

}</span>

所有支持以下layout engines的浏览器均支持CORS：（翻译自http://en.wikipedia.org/wiki/Cross-origin_resource_sharing#cite_note-10）

Gecko1.9.1（如Firefox 3.5，SeaMonkey 2.0， Camino 2.1）及以上版本；
Webkit（如Google Chrome3 以上版本，Safari 4以上版本等）；
MSHTML/Trident6.0(IE 10),MSHTML/Trident 4.0&5.0(IE 8& 9，需要借助XDomainRequest对象)；
Presto（Opera 12.00和Opera Mobile12均实现了CORS，但是Opera Mini不支持）

转载来源：http://blog.csdn.net/zlj_blog/article/details/43411625

yuanfangfan

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
跨域解决方案之二-->CORS解决跨域

前面简单介绍了JSONP解决跨域访问，顺便将看到的另一种跨域解决方案CORS（Cross-Origin Resource Sharing）即跨域资源共享作以简单介绍。 CORS，是一种服务器端的跨域解决方案，这种方案对于跨域的解决代码均在服务器端设置完成。在服务器端接收到客户端的请求后，通过获取到请求的来源站点Origin，如果愿意将资源共享给该站点，则通过设置“Access-Contr
复制链接

扫一扫