`

jquery1.4 ajax跨域访问

    博客分类:
  • js
阅读更多
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">      
<html>      
  <head> 
      <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">      
      <meta http-equiv="description" content="this is my page">      
      <meta http-equiv="content-type" content="text/html; charset=UTF-8">   

<script type="text/javascript" src="js/jquery/jquery.js"  ></script>      
     
        <script type="text/javascript">         
            function test(){      
                $.getJSON("http://server.yondor5.com:8080/remoteLogin/RequestIsLogin.jsp?Math.random()*100+1&callback=?",      
               function(data){   
                         alert(data); 
                          if(data.result=="OK"){ 
                            alert('OK'); 
                          }else{ 
                          alert('ERROR'); 
                          } 
                });               
            }      
                   
                  
        </script> 
        
  </head> 
  
  <body> 
          <% 
String username = (String)request.getSession().getAttribute("yondor.currentPassport"); 
       
if(username!=null && username.length()>0){ 
out.println("hi.welcome to our home "+username); 
%>   
<% 
}else 
{ 
%> 

<% 
} 
%> 
   <input type="button" value="跨域" id="test" onclick="test()"/>  
<div id="images">   
        </div>   
  </body> 
</html> 

访问页面index.jsp 

 

 

 

被访问页面RequestIsLogin.jsp

<%@ page language="java" contentType="text/html; charset=gbk"
    pageEncoding="gbk"%>
<%@ page import="com.yondor.LoginInfo" %>
<%
//判断在其他域名下是否登录

String callback = request.getParameter("callback"); 

  response.getWriter().print(callback+"({'result':'OK'})"); 
 %>
 
 <%
}
%>

 

 

Ajax的应用中,由于安全的问题,浏览器默认是不支持跨域调用的。传统解决的方法,包括:(参考http://bob.pythonmac.org/archives/2005/12/05/remote-json-jsonp/)

Local proxy:
Needs infrastructure (can't run a serverless client) and you get double-taxed on bandwidth and latency (remote - proxy - client).
Flash:
Remote host needs to deploy a crossdomain.xml file, Flash is relatively proprietary and opaque to use, requires learning a one-off moving target programming langage.
Script tag:
Difficult to know when the content is available, no standard methodology, can be considered a "security risk".

以上方法都各有缺陷,都不是很好多解决方案。后来出现了一种叫JSON with Padding 的技术,简称 JSONP .(原理参考http://bob.pythonmac.org/archives/2005/12/05/remote-json-jsonp/),应用JSONP可以实现JSON数据的跨域调用。非常的幸运,JQuery1.2以后支持JSONP的应用。下面侧重说明在JQuery中,Json的跨域调用。

      应用JSONP实现Json数据跨域调用,需要服务器端与客户端的合作完成。引用Jquery官方的例子,客户端掉用如下:

 

总结,用JSONP要做两件事:

      1/请求地址加参数:jsoncallback=?

      2/服务器段把jsoncallback的值作为方法名传回来,如JQUET098788(...) 

分享到:
评论

相关推荐

    JQuery1.4.js和JQuery1.4_API

    jQuery 1.4 改进了AJAX请求的错误处理机制,并增强了JSONP支持。 7. **API 文档**:JQuery 1.4 API 帮助手册提供了详尽的函数参考和示例,是开发者学习和查阅的重要资源。它涵盖了所有可用的方法、属性和事件,有助...

    Jquery1.4(最新版本)

    5. **Ajax交互(Ajax Interactions)**:jQuery 1.4的`.ajax()`函数统一了所有Ajax请求,支持JSONP、GET、POST等多种请求类型,同时提供了易于使用的回调函数,简化了异步数据处理。 ### jQuery 1.4的改进与增强 1...

    jquery1.4 jquery,jquery-1.4,jquery1.4,最新jquery.js,jquery-1.4.min.js

    **jQuery 1.4:JavaScript库的里程碑版本** jQuery是一个广泛使用的JavaScript库,它极大地简化了HTML文档遍历、事件处理、动画制作以及Ajax交互。jQuery 1.4是该库的一个重要版本,发布于2010年,带来了许多性能...

    Jquery跨域Ajax请求测试

    本示例"Jquery跨域Ajax请求测试"将详细讲解如何利用jQuery实现这一功能。 首先,了解同源策略是理解跨域问题的关键。同源策略是浏览器为了保障用户安全而设定的一项机制,它规定了只有来自同一协议、同一域名和同一...

    JQuery1.4 文档及源码

    **jQuery 1.4 文档及源码详解** jQuery 是一个高效、易用的 JavaScript 库,它极大地简化了网页的交互和动态脚本编写。本文将深入探讨 jQuery 1.4 版本,包括其核心特性、API 使用以及源码分析。 1. **jQuery 的...

    Jquery 1.4开发文档

    **jQuery 1.4 开发文档...总的来说,jQuery 1.4版本提供了强大的DOM操作、事件处理、动画制作和Ajax交互功能,而详细的API文档则是开发者得力的工具,可以帮助他们更好地利用这些功能来构建动态、交互性强的Web应用。

    jQuery 1.4 参考指南的实例源代码

    《jQuery 1.4 参考指南》是一本旨在帮助开发者深入理解和熟练运用jQuery库的教程书籍。书中通过丰富的实例,详细介绍了jQuery 1.4版本的各种功能和用法。这个压缩包包含了书中所有实例的源代码,为读者提供了一个...

    Jquery1.4.x.js及api.chm

    5. **AJAX 改进**:jQuery 的 AJAX 功能是其核心特性之一,1.4.x 版本提供了更全面的 AJAX 支持,包括 JSONP、跨域请求和 `$.ajax()` 方法的增强。 6. **API 文档**:`jQuery_CHM_1.4.4.chm` 是 1.4.4 版本的中文 ...

    jquery1.4 api

    jQuery 1.4增强了对JSONP的支持,便于跨域数据获取。 6. **链式操作**: jQuery对象的方法返回的都是jQuery对象,这使得链式调用成为可能,如`$('element').addClass('highlight').css('color', 'red')`。 7. **...

    jQuery1.4API(中文)

    jQuery1.4 API中文手册是针对该版本的详细文档,为开发者提供了丰富的参考资料。下面将详细介绍jQuery1.4 API中的核心概念、功能及使用方法。 1. **选择器(Selectors)**:jQuery的选择器基于CSS,可以方便地选取...

    jQuery使用ajax跨域获取数据

    jQuery使用ajax跨域获取数据

    jquery1.4中文手册(CHM)

    **jQuery 1.4中文手册**是一份专为开发者准备的详尽教程,它以CHM(Compiled Help Manual)格式提供,便于离线查阅。这个手册涵盖了jQuery库1.4版本的所有核心功能和API,是学习和理解jQuery的宝贵资源。 jQuery是...

    jQuery 1.4 Reference Guide PDF(包含jQuery1.4.4.js)

    在Ajax交互方面,jQuery 1.4改进了`$.ajax()`方法,支持JSONP跨域请求、HTTP基本认证和更多自定义设置。`load()`、`get()`和`post()`等便捷函数则使得异步数据获取更为简单。 jQuery 1.4还提供了一套完整的API用于...

    JQuery1.4中文文档

    JQuery1.4中文API文档,喜欢的朋友可自由下载。All For One,One For All!

    jquery1.4.js

    jQuery 1.4对Ajax功能进行了增强,`.load()`, `.get()`, `.post()`等方法提供了更好的异步数据获取能力。`.ajaxStart()`和`.ajaxStop()`等事件监听器让开发者能更好地控制Ajax请求的状态。 7. **性能优化**: ...

    JQuery-1.4 and JQuery-1.4.mini

    3. **$.ajax()的增强**:在jQuery 1.4中,$.ajax()方法更加灵活,支持JSONP、跨域请求和更多的自定义选项,方便开发者实现复杂的Ajax交互。 4. **链式操作的改进**:1.4版本进一步强化了链式操作,使得多步操作更加...

    jquery1.4中文文档

    6. **Ajax功能**: `$.ajax()`方法的回调函数现在可以访问到`jqXHR`对象,它扩展了原生XMLHttpRequest,提供了更多控制和错误处理的选项。 7. **兼容性改进**: jQuery 1.4在保持向后兼容的同时,针对不同的浏览器...

    最新JQuery类库 -- JQuery1.4

    **jQuery 1.4:一个高效、易用的JavaScript库** jQuery是一个强大的JavaScript库,它极大地简化了HTML文档遍历、事件处理、动画设计和Ajax交互。jQuery 1.4是该库的一个重要版本,发布于2010年,带来了许多性能优化...

    Ajax跨域访问(ASP.NET Web)

    本教程将重点讲解如何在ASP.NET Web环境中处理Ajax跨域访问。 一、理解同源策略 同源策略是浏览器为了保护用户安全而实施的一项安全机制,它禁止了一个源(domain)的文档或脚本获取或操作另一个源的资源。这意味着...

Global site tag (gtag.js) - Google Analytics