上篇博客介绍了JSONP原理,其不足,就是只能使用GET提交,若传输的数据量大,这个JSONP方式就歇菜了。那这篇博客就来介绍另一种跨域介绍方案—CORS。
相对JSONP,CORS支持POST提交,并且实施起来灰常简单,CORS原理只需要向响应头header中注入Access-Control-Allow-Origin,这样浏览器检测到header中的Access-Control-Allow-Origin,则就可以跨域操作了。
具体实现如下:
前台使用普通的Ajax提交方式,跟普通访问一样,无需更改。
- $.ajax({
- url:"http://localhost:8080/crcp/rcp/t99eidt/testcors.do",
- async :false,
- type:"POST",
- success:function(data){
- var a=JSON.parse(data);
- var html=JSON.stringify(a.RESULTSET);
- $("#testcors").html(html);
- },
- error:function(){
- alert("error");
- }
- });
服务器Action方法如下:
- public void testCors() throws Exception{
- JSONObject jsonObject=new JSONObject();
- List list=new ArrayList();
- for(int i=0;i<4;i++){
- Map paramMap=new HashMap();
- paramMap.put("bank_no", 100+i);
- paramMap.put("money_type", i);
- paramMap.put("bank_name", "测试代码"+i);
- paramMap.put("bank_type", i);
- paramMap.put("bank_status", 0);
- paramMap.put("en_sign_ways", 1);
- list.add(paramMap);
- }
- JSONArray rows=JSONArray.fromObject(list);
- jsonObject.put("RESULTSET", rows);
- HttpServletRequest request=ServletActionContext.getRequest();
- HttpServletResponse response=ServletActionContext.getResponse();
- response.setHeader("Access-Control-Allow-Origin", "*");
- response.setCharacterEncoding("UTF-8");
- Writer out = response.getWriter();
- System.out.println(jsonObject.toString());
- out.write(jsonObject.toString());
- }
response.setHeader("Access-Control-Allow-Origin", "*");这句代码中*代码,服务器允许任何人访问。当然可以设置规定访问的域名。比如只允许http://localhost:8080/crcp这个域下的访问。则把*代替成这个域名即可。
响应图如下:
CORS实现起来比较简单,但是缺点是支持浏览器有限。目前支持的浏览器版本如下【摘自其他博客】
相关推荐
四、jQuery跨域调用示例 ```javascript // JSONP 示例 $.ajax({ url: 'http://example.com/data?callback=?', type: 'GET', dataType: 'jsonp', success: function(data) { console.log(data); } }); // CORS...
然而,为了实现特定功能,如跨域调用Window服务来获取本机硬件信息,我们需要采用一些特殊的技术来规避这种限制。本文将详细介绍如何使用JS进行跨域调用,特别是结合WCF(Windows Communication Foundation)技术和...
解决Vue调用Spring Boot接口时出现的403跨域问题,可以通过在Spring Boot后端添加@CrossOrigin注解或者通过全局配置类来实现CORS支持。需要注意的是,这需要Spring Boot版本至少为2.x,因为旧版本可能不支持CORS相关...
JavaScript(JS)与Windows Communication Foundation(WCF)服务之间的跨域调用是Web开发中常见的需求,尤其是在构建分布式系统和前后端分离的应用时。本文将详细介绍如何实现JS跨域调用WCF服务,并通过一个控制台...
本示例"Jquery跨域Ajax请求测试"将详细讲解如何利用jQuery实现这一功能。 首先,了解同源策略是理解跨域问题的关键。同源策略是浏览器为了保障用户安全而设定的一项机制,它规定了只有来自同一协议、同一域名和同一...
标题 "provider-coustomer-CORS跨域.zip" 暗示了这个压缩包包含的项目是关于在Java环境中,特别是SpringBoot框架下处理CORS(Cross-Origin Resource Sharing,跨源资源共享)的问题。CORS是一种机制,它允许Web应用...
在Web开发中,跨域(Cross-Origin Resource Sharing, CORS)是一个常见的需求,特别是在前后端分离的架构中。PHP、AJAX 和 JSONP 是解决这个问题的三种主要技术。本篇文章将详细探讨这些技术以及它们在跨域请求中的...
### 前端跨域原理及解决方案详析 #### 一、引言 在现代互联网技术的快速发展下,跨域问题成为了许多前端开发者不可避免的技术挑战之一。本文将深入探讨前端跨域的基本概念、原理及其解决方案,帮助开发者更好地...
JSONP的基本原理是动态创建`<script>`标签,将目标URL设置为`src`属性,目标URL会返回一个JavaScript函数调用,其中包含要传递的数据。例如,服务器返回`fun({"data": "Hello, World!"})`,而客户端需要预先定义好`...
这个“MVC+WebAPI跨域调用.rar”压缩包文件提供了一个简单的示例,用于演示如何使用jQuery在MVC(Model-View-Controller)框架下调用WebAPI实现跨域通信。 **什么是MVC模式?** MVC是一种流行的设计模式,广泛应用...
以下是一个简单的CORS设置示例: ```php header('Access-Control-Allow-Origin: *'); header('Access-Control-Allow-Methods: GET, POST'); header('Access-Control-Allow-Headers: X-Requested-With, Content-Type...
这通常通过调用GlobalConfiguration类的EnableCors方法完成,需要提供一个 CORS策略对象,定义允许哪些源、方法和请求头进行跨域请求。 例如,以下代码段展示了如何启用允许所有源的CORS策略: ```csharp var cors...
本示例将通过一个简单的SpringBoot和Ajax的集成应用,展示如何配置CORS以实现跨域请求。 **一、SpringBoot与Ajax** 1. **SpringBoot**:是基于Spring框架的快速开发工具,简化了配置,提供了自动配置、内嵌Web...
在提供的压缩包中,`TestAjax`可能是包含实现JSONP和CORS跨域请求的示例代码文件。这个文件可能包含了创建XMLHttpRequest对象、设置请求头、处理响应等内容的JavaScript代码,用于演示如何在实际项目中应用这些跨域...
4. **检查跨域设置**:如果使用非IE浏览器,确保服务器端允许跨域请求(CORS)。 5. **尝试使用现代API**:对于非IE浏览器,可以考虑使用XMLHttpRequest或fetch API,这些API提供更丰富的错误处理和跨域支持。 一旦...
然而,在进行前后端分离或者API调用时,跨域限制可能会成为开发的障碍。Tomcat,作为广泛使用的Java Servlet容器,提供了解决跨域问题的配置方法。 【描述】:“亲证可用,真实有效,压缩包里有使用的具体说明,...
总结,JQuery调用跨域WCF服务主要通过JSONP和CORS两种方式,涉及到服务端的配置以及客户端的请求设置。正确理解和使用这些技术,可以有效地在不同域之间实现数据交互。在实际项目中,应结合业务需求和安全因素选择...
在实际应用中,选择哪种跨域方法取决于具体的需求,如兼容性、安全性、数据交换的复杂性等。同时,开发者需要注意跨域访问可能带来的安全风险,如XSS(跨站脚本攻击)和CSRF(跨站请求伪造)。 综上所述,iframe...
2. CORS:CORS是现代浏览器支持的一种更安全、更灵活的跨域方式。$.ajax、$.get、$.post等方法都可以通过设置headers来启用CORS。 - 在服务器端,设置响应头`Access-Control-Allow-Origin`为允许跨域的源,例如`*`...