最近项目需要使用jquery跨域请求,于是就研究了一下。终于成功了。这里把代码写出来分享一下。
需要注意,jquery跨域需要前后台合作的。
客户端
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="common/jquery-1.4.4.min.js"></script>
</head>
<body>
<input type="button" value="test" onclick="testfn()">
</body>
<script type="text/javascript">
function testfn()
{
$.ajax({
type : "get",
//async:false,
url : "http://www.test.com:8081/newcqa/indexutil/test",
dataType : "jsonp",
jsonp: "callbackparam",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(默认为:callback)
jsonpCallback:"ajaxTestFn",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名
success : function(json){
alert(json["test"]);
},
error:function(){
alert('fail');
}
});
}
function ajaxTestFn(json)
{
alert(22+" ---"+json);
}
</script>
</html>
服务端代码
@RequestMapping(value = "/test")
public void test(HttpServletRequest request,
HttpServletResponse response, ModelMap model) throws IOException
{
JSONObject json = new JSONObject();
String callbackFunName = request.getParameter("callbackparam");
json.put("test", true);
response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();
out.write(callbackFunName +"("+json.toString()+")");
}
分享到:
相关推荐
**jQuery 跨域请求的实现** 在Web开发中,由于同源策略的限制,JavaScript通常无法直接发起跨域请求,即请求与当前页面不在同一域名下的资源。然而,随着Web应用的发展,有时我们需要从不同源获取数据,例如,从API...
jQuery跨域调用主要是通过JSONP(JSON with Padding)和CORS(Cross-Origin Resource Sharing)这两种机制来实现的。JSONP是一种非官方的跨域数据交互协议,而CORS是W3C标准,允许服务器声明哪些来源可以访问其资源...
总结来说,这个压缩包提供的示例展示了如何使用jQuery的Ajax进行跨域请求,并在Tomcat服务器上的Java Servlet中处理这些请求。这个例子对于理解和解决实际项目中可能出现的跨域问题非常有帮助。开发者需要理解CORS...
2. **JQuery跨域**: - 跨域是浏览器的一项安全策略,限制了JavaScript脚本只能访问同一源下的资源。JQuery提供了解决跨域问题的方法,如JSONP(JSON with Padding)和CORS(Cross-Origin Resource Sharing)。 - ...
4. **jQuery的$.ajax()和$.getJSON()**:jQuery提供了一套方便的API来处理Ajax请求,其中包括跨域请求。通过设置`jsonp`参数,jQuery的`$.ajax()`和`$.getJSON()`方法可以自动处理JSONP请求。对于CORS,只需设置`...
### AJAX跨域请求详解 #### 一、引言 在Web开发中,由于浏览器的同源策略限制,AJAX请求通常只能向同源服务器发送请求。然而,在实际应用中,跨域请求的需求非常常见。本篇文章将通过一个具体的示例(JSP页面+后台...
在Web开发中,Ajax(Asynchronous JavaScript and XML)技术被广泛用于实现页面...在前端,我们使用jQuery或原生JavaScript发起跨域请求。理解并正确配置CORS,以及安全地使用跨域请求,是Web开发中不可或缺的知识点。
SpringBoot应用可以通过配置CORS来允许特定或所有来源的跨域请求。在SpringBoot应用中,你可以创建一个配置类,比如`CorsConfig`,并添加一个`CorsFilter`。在`buildConfig`方法中,设置`CorsConfiguration`对象,...
6. **跨域请求**:如果前端和后端不在同一个源下,可能会遇到跨域问题。服务器端需要设置CORS策略,允许特定的来源进行请求。在Java中,可以通过Filter或在Servlet中添加响应头来实现。 综上所述,"Java通过jQuery...
### jQuery $.getJSON() 跨域请求知识点总结 #### 跨域请求基础 在Web开发中,跨域请求是一个非常常见的问题,它的本质是浏览器的同源策略。同源策略限制了从同一个源加载的文档或脚本如何与来自另一个源的资源...
例如,使用JSONP跨域请求,防止XSS和CSRF攻击,以及使用缓存和异步加载来提升用户体验。同时,合理组织和压缩jQuery及相关资源文件,可以减少页面加载时间。 总的来说,jQuery与Java的结合应用,使得前端界面更生动...
在这个项目中,jQuery可能被用来处理用户选择文件的事件,以及通过AJAX发起跨域POST请求。 3. **JSP (Java Server Pages)**: JSP是一种动态网页技术,它允许在HTML中嵌入Java代码,服务器端执行这些代码并将结果...
本文将详细介绍这两种跨域请求的原理以及jQuery的实现。 首先,我们来看JSONP的工作原理。JSONP是一种绕过同源策略的技术,它利用了浏览器允许动态插入`<script>`标签的特性。当发送一个JSONP请求时,jQuery会创建...
JSONP(JSON with Padding)是一种解决跨域请求的方法,主要用于解决不同域之间因浏览器同源策略限制而无法进行AJAX请求的问题。在AJAX请求中,浏览器的同源策略限制了与当前页面不同域的服务器进行数据交互,而...
jQuery跨域访问是指在浏览器端使用jQuery进行AJAX请求时,处理不同源策略所引起的跨域问题。不同源策略是浏览器为了安全考虑而实施的一种限制,它阻止了来自不同域名、端口或协议的页面相互请求资源。这种策略防止了...
在实际应用中,可能会遇到跨域问题,此时需要在Java后台设置CORS策略。在Servlet中,可以通过HttpServletResponse的header设置: ```java response.setHeader("Access-Control-Allow-Origin", "*"); ``` 对于POST...
此外,随着Web技术的发展,其他解决方案如CORS(跨源资源共享)也成为了实现跨域请求的另一种选择,但在某些情况下JSONP依然有其独特的适用场景。 通过本文的介绍,读者应该对如何在Java后台环境下实现Ajax的跨域...
然而,`<script>`标签可以加载任何源的JavaScript代码,JSONP就是利用这一点来实现跨域请求的。 1. **JSONP的工作原理**: JSONP的基本思路是,客户端向服务器发送请求时,会提供一个回调函数名。服务器接收到请求...
1. 使用jQuery.getJSON方法发起跨域请求。 2. jQuery自动构建一个script标签并以JSONP方式请求数据。 3. 服务器返回数据,同时包含回调函数名。 4. 数据返回后,jQuery会自动调用回调函数来处理返回的数据。 四、...
JSONP(JSON with Padding)是一种跨域数据交互协议,它利用了浏览器允许加载跨域JavaScript脚本的特性来实现AJAX的跨域请求。由于同源策略的限制,普通的AJAX请求不能跨越域名进行通信,但JSONP巧妙地绕过了这一...