跨域访问JQuery+.NET实现的一种思路,以及极简单Demo

由于浏览器安全的限制,XMLHttpReques只能调用本地的,本域名下的文件;一旦调用非本域名下的文件,就调用不到,返回个错误。

比如这段代码:

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head >
    
< title ></ title >
    
< script  type ="text/javascript"  src ="jquery-1.5.1.js" ></ script >
    
< script  type ="text/javascript" >

        $.ajax({
        url: 
" http://www.douban.com/feed/review/latest " ,
            type: 
" GET " ,
            dataType: 
' xml ' ,
            timeout: 
1000 ,
            cache: 
false ,
            error: 
function (XMLHttpRequest, textStatus, errorThrown) {
            alert(
" 加载xml错误 "   +  XMLHttpRequest.readyState);
            },
            success: 
function (xml) {
                alert(
" getIT " );
                
            }
        })
    

          
    
</ script >
</ head >
< body >

</ body >
</ html >

 执行的话会报错,加载xml错误0。

啥子意思呢?请允许我复制。

Jquery中AJAX参数详细列表:
error Function(默认: 自动判断 (xml 或 html)) 请求失败时将调用此方法。这个方法有三个参数:XMLHttpRequest 对象,错误信息,(可能)捕获的错误对象。
function (XMLHttpRequest, textStatus, errorThrown) {
// 通常情况下textStatus和errorThown只有其中一个有值
this; // the options for this ajax request
}

一、error:function (XMLHttpRequest, textStatus, errorThrown)
{
}
(默 认: 自动判断 (xml 或 html)) 请求失败时调用时间。参数有以下三个:XMLHttpRequest 对象、错误信息、(可选)捕获的错误对象。如果发生了错误,错误信息(第二个参数)除了得到null之外,还可能是"timeout", "error", "notmodified" 和 "parsererror"。

textStatus:

 "timeout", "error", "notmodified" 和 "parsererror"。

二、error事件返回的第一个参数XMLHttpRequest有一些有用的信息:

XMLHttpRequest.readyState:

状态码 

0 - (未初始化)还没有调用send()方法 

1 - (载入)已调用send()方法,正在发送请求 

2 - (载入完成)send()方法执行完成,已经接收到全部响应内容 

3 - (交互)正在解析响应内容 

4 - (完成)响应内容解析完成,可以在客户端调用了

-------------------------------------------------------复制结束

 

也就是说XMLHttpRequest还没开始send。但是Fiddler的结果是:

 

 

说明你请求的数据,服务器已经返回,但浏览器不允许XMLHttpRequest接收吧。但为什么XMLHttpRequest.readyState是0呢,没send呢,不懂,请教大家。

还有解决方案是,用$.getJSON,用JSONP,这两个要远程服务器支持才行。调用远程的JS文件,通过回发函数自己解析。并不普遍适用。

于是就,自己服务器访问远程xml文件,写到自己的文件并生成,给自己的网页前台JQuery调用就行。

就这么干,这是访问远程xml文件代码:

using  System;
using  System.Collections.Generic;
using  System.Linq;
using  System.Web;
using  System.Web.UI;
using  System.Web.UI.WebControls;
using  System.Net;
using  System.IO;

public   partial   class  Default2 : System.Web.UI.Page
{
    
protected   void  Page_Load( object  sender, EventArgs e)
    {
        
string  url  =   @" http://www.douban.com/feed/review/latest " ;
        WebRequest req 
=  WebRequest.Create(url);
        WebResponse rep 
=  req.GetResponse();
        Stream webstream 
=  rep.GetResponseStream();
        StreamReader sr 
=   new  StreamReader(webstream);
        
string  br  =  sr.ReadToEnd();
        Response.Write(br);
        Response.End();
    }
}

然后调用它:

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head >
    
< title ></ title >
    
< script  type ="text/javascript"  src ="jquery-1.5.1.js" ></ script >
    
< script  type ="text/javascript" >

        $.ajax({
        url: 
" Default2.aspx " ,
            type: 
" GET " ,
            dataType: 
' xml ' ,
            timeout: 
1000 ,
            cache: 
false ,
            error: 
function (XMLHttpRequest, textStatus, errorThrown) {
            alert(
" 加载xml错误 "   +  XMLHttpRequest.status);
            },
            success: 
function (xml) {
                alert(
" getIT " );
                
            }
        })
    

          
    
</ script >
</ head >
< body >

</ body >
</ html >

//---------------------------------------针对评论里的JSONP例子,请再允许我复制

调用页面:

 

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head >
    
< title ></ title >
< script  type ="text/javascript"  src ="jquery-1.5.1.js" ></ script >
    
< script  type ="text/javascript" >
    
/* 使用JSON
// This is our function to be called with JSON data
function showPrice(data) {
    alert("Symbol: " + data.symbol + ", Price: " + data.price);
}
var url = "ticker.js"; // URL of the external script
// this shows dynamic script insertion
var script = document.createElement('script');
script.setAttribute('src', url);

// load the script
document.getElementsByTagName('head')[0].appendChild(script); 
*/

        
// 使用JSONP
         function  showPrice(data) {
            alert(
" Symbol:  "   +  data.symbol  +   " , Price:  "   +  data.price);
        }
        
        $(
function () {
            
var  url  =   " ticker.js " ;
            $.getJSON(url 
+   " ?callback=? " function (data) {
                alert(
" Symbol:  "   +  data.symbol  +   " , Price:  "   +  data.price);
            });
        });
        
    
</ script >

</ head >
< body >
</ body >
</ html >

ticker.js文件

showPrice({ symbol:  ' IBM ' , price:  91.42  });

 应当这样使用的吧。。。。

转载于:https://www.cnblogs.com/samwu/archive/2011/07/21/2112905.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值