`
- 浏览:
1885628 次
-
分别使用FlyJSONP和JQuery实现跨域的异步请求
直接上代码吧,介绍方面的东西都在代码注释里
首先是使用FlyJSONP实现跨域的异步请求
- <%@pagelanguage="java"pageEncoding="UTF-8"%>
- <scripttype="text/javascript"src=../../"js/flyjsonp.min.js"></script>
- <scripttype="text/javascript">
-
functiongetJFBCustomState(){
- FlyJSONP.init({debug:true});
- FlyJSONP.post({
- url:'http://123.125.**.***:8088/ecpaycus/web/getCustomizeByPhoneNo',
- parameters:{phoneNo:'18601148104'},
- success:function(data){
-
varcustomState=data.customState;
- alert('服务器返回结果为:'+customState);
- }
-
-
-
-
-
-
-
-
-
- });
- }
- </script>
- <spanstyle="color:blue;text-decoration:underline;cursor:pointer;"onclick="getJFBCustomState();">点此完成定制</span>
-
- <%--
- ==========================================================================================
- FlyJSONP
- 主页:http:
- 概述:FlyJSONP是一个应用JSONP实现跨域请求的相当轻量级的JavaScript类库
- FlyJSONP不依赖于任何JavaScript框架,只需设置一些参数便能够用它实现跨域的POST和GET请求
- 补充:本示例在IE9.0.8112.16421和FireFox9.0.1上测试,均通过
- 另外,我是在这个网站发现它的-->http:
- 用法:上面是客户端代码,下面是服务端代码
- StringphoneNo=request.getParameter("phoneNo"));
- response.setContentType("application/json;charset=UTF-8");
- response.getWriter().print("{customState:'hasCustomized'}");
- 注意:服务端输出给客户端时,输出的必须是json字符串,否则客户端无法接收
- ==========================================================================================
- --%>
接下来就是使用JQuery实现跨域的异步请求
- <%@pagelanguage="java"pageEncoding="UTF-8"%>
- <scripttype="text/javascript"src=../../"js/jquery-1.7.1.min.js"></script>
- <scripttype="text/javascript">
- $(function(){
- $('#validateCustom').click(function(){
- $.getJSON('http://123.125.**.***:8088/ecpaycus/web/getCustomizeByPhoneNo?jsoncallback=?&phoneNo=18601148104',
-
function(json){
-
varcustomState=json.customState;
- alert('服务端返回结果为:'+customState);
- }
- );
- });
- });
- </script>
- <spanstyle="color:blue;text-decoration:underline;cursor:pointer;"id="validateCustom">点此完成定制</span>
-
- <%--
- ==========================================================================================
- 说明:本示例在IE9.0.8112.16421和FireFox9.0.1上测试,均通过
- 用法:上面是客户端代码,下面是服务端代码
- StringphoneNo=request.getParameter("phoneNo"));
- Stringjsoncallback=request.getParameter("jsoncallback");
- StringjsonReturn="{customState:'hasCustomized'}";
- response.setContentType("application/json;charset=UTF-8");
- response.getWriter().print(jsoncallback+"("+jsonReturn+")");
- 注意:服务端输出给客户端时,输出的必须是json字符串,否则客户端无法接收
- 且,客户端请求时,必须提供回调函数名,并以参数形式放到请求的URL后面
- 服务端输出给客户端时,必须将接收到的回调函数名字放到json字符串的前面
- ==========================================================================================
- --%>
分享到:
Global site tag (gtag.js) - Google Analytics
相关推荐
在jQuery中,使用`xhrFields`参数添加`withCredentials`设置为`true`,可以实现携带Cookie的跨域请求。 ```javascript $.ajax({ type: "GET", url: "http://example.com/remote-service", xhrFields: { ...
综上所述,"Java通过jQuery实现ajax异步请求"的示例工程涵盖了客户端与服务器端的交互流程,包括使用jQuery发起AJAX请求、Java后端处理请求并返回数据,以及数据格式的转换和错误处理。了解并掌握这些知识点,对于...
本文主要讨论的是通过JQuery实现跨域请求JSON数据的方式——JSONP。 #### 三、JSONP原理及使用 **JSONP**是一种绕过同源策略的技术,它利用了`<script>`标签不受同源策略限制的特点。当使用JSONP进行跨域请求时,...
然而,通过使用jQuery和特定的技术手段,我们可以实现跨域异步上传文件。本文将对这一过程进行总结。 首先,要实现跨域异步上传,我们依赖于jQuery.form插件。这个插件专门用于处理异步表单提交,使得文件上传变得...
当jQuery使用`dataType: 'jsonp'`时,它实际上是在做以下几件事: 1. **创建动态`<script>`标签**:jQuery会在DOM中创建一个新的`<script>`标签,其`src`属性指向跨域服务器的URL。URL中通常会包含一个回调函数名...
总结,ASP.NET与jQuery的跨域提交请求数据涉及到CORS策略的配置和JavaScript的Ajax调用。通过正确设置服务器端的响应头和jQuery的请求参数,可以顺利实现在不同源之间进行数据交互。在实际项目中,应根据需求灵活...
本篇文章将详细讲解如何利用jQuery的jsonp方法实现Ajax跨域请求,以及如何在服务器端使用.Net的*.handler和WebService来返回JSON数据。 首先,理解JSONP的基本原理。JSONP是一种非官方的协议,通过动态创建`...
为了提升用户体验和系统的安全性,实现跨域异步单点登录(SSO)成为一个重要课题。本文将详细介绍在FineReport表格制作软件中,如何通过ajax技术实现跨域异步单点登录的方法。 首先,我们需要了解单点登录的基本...
jQuery的Ajax功能提供了`$.ajax()`方法,它是处理异步请求的核心。在解决跨域问题时,我们可以利用jQuery的`jsonp`模式。JSONP(JSON with Padding)是一种绕过同源策略的方法,它利用`<script>`标签可以跨域加载...
2. jQuery使用CORS:在`$.ajax()`方法中,设置`dataType: 'json'`或其它类型,并在请求头中设置`crossDomain: true`,jQuery会自动处理CORS请求。 四、jQuery跨域调用示例 ```javascript // JSONP 示例 $.ajax({ ...
综上所述,"用YQL和Jquery实现的跨域html页面截取"的解决方案巧妙地结合了YQL的跨域能力和jQuery的JSONP请求功能,实现了在前端获取和处理其他域的HTML内容,这对于数据聚合、分析或者构建Web应用等场景十分有用。...
jQuery中的$.ajax方法是实现异步数据请求的核心,它允许开发者定义多种参数来定制请求行为。在跨域请求中,`dataType`参数设置为'jsonp'是关键,这告诉jQuery我们打算使用JSONP来处理响应。 JSONP是一种绕过同源...
在Web开发中,Ajax技术被广泛用于实现页面的异步更新,但浏览器的同源策略(Same-Origin Policy)限制了Ajax请求只能向同源(协议、域名、端口均相同)的服务器发送。这在需要跨域获取数据时就会遇到问题。为了解决...
这篇博客将探讨如何使用jQuery实现跨域请求以及如何获取返回值。 首先,我们需要理解什么是跨域请求。跨域请求是指一个域下的文档或脚本尝试请求另一个域下的资源,由于安全原因,通常会被浏览器阻止。但为了实现...
**jQuery 跨域请求的实现** 在Web开发中,由于同源策略的限制,JavaScript通常无法直接发起跨域请求,即请求与当前页面不在同一域名下的资源。然而,随着Web应用的发展,有时我们需要从不同源获取数据,例如,从API...
跨域异步上传文件功能的实现是Web开发中常见的需求,特别是在前后端分离的项目中,前端页面和后端服务往往部署在不同的域名下,从而产生跨域问题。JQuery作为流行的JavaScript库,提供了诸多方便的API,尤其在处理...
JQuery 的 AJAX 功能是实现异步数据交互的核心部分,对于跨域提交参数和接收 JSON 数据的需求,JQuery 提供了多种解决方案。 首先,JQuery 的 AJAX 功能可以使用 `$.post()` 方法来发送 POST 请求,该方法可以取代...
在实际应用中,我们可以使用 JSONP 来实现跨域请求,以便从其他域名下的服务器获取数据。但是,我们需要注意的是,使用 JSONP 会存在安全风险,因为它可以被恶意攻击所利用。 在使用 JSONP 时,我们需要注意以下几...