Java跨域以及实现原理

最近研究了一下跨域,没接触之前我的印象就是配合单点登录的一种方式,后来在网上看到资料才知道不仅仅是这一种,用法很多,具体的可以去网上搜索。

  一个众所周知的问题,Ajax直接请求普通文件存在跨域无权限访问的问题,甭管你是静态页面、动态网页、web服务、WCF,只要是跨域请求,一律不准。下面我就在自己本地用8081端口请求8081的接口看看会提示什么吧?

如上图所示,已经被浏览器拦截了,所以现在我们需要换jsonp的方法来获取服务器返回的数据。

服务端的接口如下:

@RequestMapping(value ="/hello", method = RequestMethod.GET)
    @ResponseBody
    public String hello(HttpServletRequest request){
        Map<String, String> map = new HashMap<String, String>();
        map.put("result", "content");
        JSONObject resultJSON = JSONObject.fromObject(map); // 根据需要拼装json
        String jsonpCallback = request.getParameter("jsonpCallback");
        // 返回jsonp格式数据
        System.out.println(jsonpCallback + "(" + resultJSON.toString(1, 1) + ")");
        return jsonpCallback + "(" + resultJSON.toString(1, 1) + ")";
    }

拼接的格式为:jQuery164006948568608122441_1476774974068({"result": "content"})  其实就是在json外面包了一下而已,这样在ajax就能正常得到json里面的数据了

这里给贴上JSON和JSONP的数据以便大家对比:

{
    "message":"获取成功",
    "state":"1",
    "result":{"name":"工作组1","id":1,"description":"11"}
}
callback({
    "message":"获取成功",
    "state":"1",
    "result":{"name":"工作组1","id":1,"description":"11"}
})

尽管实现了跨域的功能,但是一直好奇为什么jsonp就能得到数据了呢,带着好奇我开始在网上查阅资料并自己动手实践和理解,最终明白了内部运作原理。首先可以发现在引入外部的css或者js的时候是不会受到浏览器拦截的,比如src没有受到跨域的影响,那么jsonp是否是利用这个原理呢?答案是的,JSONP就是利用动态生成的js格式文件把数据装进去传给客户端进行解析。

下面是sonp客户端实现的核心部分实例,通过js组装<script type="text/javascrtpt" src="http://xxx.xxx.com?callback=xxx">的js片段,通过src不受跨域影响的原理把需要访问其他域名的地址set到src的属性里请求。

 // 提供jsonp服务的url地址(不管是什么类型的地址,最终生成的返回值都是一段javascript代码)
            var url = "http://localhost:8080/hello?callback=flightHandler";
            // 创建script标签,设置其属性
            var script = document.createElement(‘script‘);
            script.setAttribute(‘src‘, url);
            // 把script标签加入head,此时调用开始
            document.getElementsByTagName(‘head‘)[0].appendChild(script);  
时间: 2024-10-27 11:15:14

Java跨域以及实现原理的相关文章

解决Ajax 跨域问题 - JSONP原理解析

解决Ajax 跨域问题 - JSONP原理解析 为什么会有跨域问题? - 因为有同源策略 同源策略是浏览器的一种安全策略,所谓同源指的是 请求URL地址中的 协议, 域名 和 端口 都相同,只要其中之一不相同就是跨域 同源策略主要为了保证浏览器的安全性 在同源策略下,浏览器**不允许**Ajax跨域获取服务器数据 http://www.example.com/detail.html 跨域请求: http://api.example.com/detail.html 域名不同 http://www.

JavaScript 九种跨域方式实现原理

前言 前后端数据交互经常会碰到请求跨域,什么是跨域,以及有哪几种跨域方式,这是本文要探讨的内容. 一.什么是跨域? 1.什么是同源策略及其限制内容? 同源策略是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到 XSS.CSFR 等***.所谓同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个 ip 地址,也非同源.同源策略限制内容有: Cookie.LocalStorage.IndexedDB 等存储性内容DOM 节点AJAX 请求发送

九种跨域方式实现原理

前言 前后端数据交互经常会碰到请求跨域,什么是跨域,以及有哪几种跨域方式,这是本文要探讨的内容. 本文完整的源代码请猛戳github 博客 一.什么是跨域? 1.什么是同源策略及其限制内容? 同源策略是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到 XSS.CSFR 等攻击.所谓同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个 ip 地址,也非同源. 同源策略限制内容有: Cookie.LocalStorage.IndexedDB

js,java,ajax实现跨域访问及其原理

http://blog.csdn.net/saytime/article/details/51540876 这篇文章对跨域访问做了较为细致得分析,我这里做下简单总结 1.实现跨域访问原理: 浏览器由于同源策略不能做跨域访问,但是<script>标签是开放策略能够跨域访问,所以突破口就是通过<script>来实现跨域访问获得其他地方得json数据 jsonp模式: JSONP(JSON with Padding)是JSON的一种"使用模式",可用于解决主流浏览器的

jquery跨域请求的原理

jquery 跨域请求什么实现? jQuery  $.ajax()支持get方式的跨域,这其实是采用jsonp的方式来完成的.,$.getJSON是$.ajax()的封装,可以参考jquery aip 的$.getJSON部分. 2.什么是 JSONP? JSONP(JSON with Padding-填充json数据也就是常用的json跨域方式):利用script标签,通过特定的src地址的调用,来执行一个客户端的js函数,在 服务器端生成相对的数据(json格式)并以参数的形式传递给这个客户

JAVA跨域资源访问CORSFilter

当一个资源从与该资源本身所在的服务器不同的域或端口不同的域或不同的端口请求一个资源时,资源会发起一个跨域 HTTP 请求. 出于安全考虑,浏览器会限制从脚本内发起的跨域HTTP请求.跨域资源共享机制允许 Web 应用服务器进行跨域访问控制,从而使跨域数据传输得以安全进行.浏览器支持在 API 容器中使用 CORS,以降低跨域 HTTP 请求所带来的风险. 针对于JAVA开发而言,为了更好的做业务分层,经常会将前后端代码分离开来,发布在不同的服务器上,此时,便会遇到跨域的问题. 跨域有很多种解决方

详解5种跨域方式及其原理

同源定义 如果两个页面拥有相同的协议(protocol),端口(如果指定),和主机,那么这两个页面就属于同一个源(origin). 以下是同源检测的示例 URL 结果 原因 http://store.company.com/dir2/other.html Success http://store.company.com/dir/inner/another.html Success https://store.company.com/secure.html Failure 协议不同 http://

Ajax跨域:Jsonp原理解析

推荐先看下这篇文章:JS跨域(ajax跨域.iframe跨域)解决方法及原理详解(jsonp) JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为“Same-Origin Policy”(同源策略).这一策略对于JavaScript代码能够访问的页面内容做了很重要的限制,即JavaScript只能访问与包含它的文档在同一域下的内容. JavaScript这个安全策略在进行多iframe或多窗口编程.以及Ajax编程时显得

Ajax + java 跨域访问Json

使用jsonp跨域获取json数据.Ajax获取JAVA服务器json数据. 在Servlet 中代码: protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setHeader("Access-Control-Allow-Origin", "*");//开启CORS,