现在的位置: 首页 > 综合 > 正文

AJAX笔记

2012年09月07日 ⁄ 综合 ⁄ 共 5081字 ⁄ 字号 评论关闭
  1. AJAX简介

没有AJAX会怎样?普通的asp.net每次执行服务器端的方法时侯都需要刷新当前页面,比如要显示服务器端的时间。

每次都要刷新页面的坏处:页面刷新打断用户操作,速度慢,增加服务器的流量压力。如果没有AJAX,在youku看视频的过程中如果点击了“顶”,踩,翻页,页面就会刷新,视频会被打断。

  AJAX(asynchronous JavaScript and XML 一步Javascript和XML)是一种进行页面局部异步刷新的技术。用AJAX向服务器发送请求和获取服务器返回的数据并且更新到界面中,不是整个页面刷新,而是在HTML页面中使用Javascript创建XMLHTTPRequest对象来发送请求以及获得返回的数据,就行Javascript版本的WebClient一样,在页面中由XMLHTTPRequest来发出Http请求和获得服务器的返回数据,这样页面就不会刷新了。XMLHTTPRequest是AJAX的核心对象。

//下面就是通过Javascript代码发送一个异步请求,取得返回信息更新到原来页面中的核心代码

<script type="text/javascript">

        function btnClick(){

          var xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");//创建xmlhttp对象,相当于WebClient。

          if(!xmlhttp) {

          alert("创建xmlhttp对象异常");

          return false;

          }

          xmlhttp.open("POST","GetData1.ashx?ts="+new Date(),false);//准备向服务器的GetData1.ashx发出post请求。

          //xmlhttp默认(也推荐)不是同步请求的,也就是Open方法并不像WebClient的DownloadString那样把服务器返回的额数据拿到才返回,是异步的,因此需要监听onreadystatechange事件。

          xmlhttp.onreadystatechange=function(){

          if(xmlhttp.readystate==4){

                  if(xmlhttp.status==200){ //如果状态码为200则是成功。

                  document.getElementById("txtTime").value=xmlhttp.responseText;//responseText属性为服务器返回的文本。

                 }

                 else{

                  alert("AJAX服务器返回错误!");

                 }

            }

          }

          xmlhttp.send();//这时才开始发送请求。

        }

</script>

<body>

<input type="text" id="txtTime" />

<input type="button" id="btn" value="button" onclick="btnClick()" />

</body>

Javascript:中对中文进行url编码用encodeURI(“中国”);

JQuery AJAX

new ActiveXObject(“Micriosoft.XMLHTTP”);是ie中创建XMLHTTPRequest对象的方法,非ie浏览器中创建方法是new XMLHTTPRequest()。为了兼容不同的浏览器需要编写很多代码。

JQuery中封装的AJAX操作方法$.post(),$.get()等;$.post(“GetData1.ashx”,function(data,textStatus){});

回调函数中data参数为服务器返回的数据,textStatus为服务器返回状态码,textStatus为“success”表示成功。

$.post()是对$.ajax()的post方法提交AJAX查询的封装。还有$.get();

Jquery版本的AJAX操作:

  function btnClick2(){

//$.post("GetData1.ashx",{"ts":new Date()},function(data,textStatus){

$.post("GetData1.ashx?ts="+new Date(),function(data,textStatus)

{ if(textStatus=="success"){

            $("#txtTime").val(data);

          }

       else{

            alert("AJAX服务器返回错误!");

        }

  });

在JQuery封装的post,get方法中,请求的页面中如果需要传参数,我们可以直接拼凑,也可以post(),get()方法的重载,第二个参数为QueryString的字典形式: {"ts":new Date()},

通过AJAX加载评论列表。

//一般处理程序页面:

StringBuilder sb1 = new StringBuilder();

var comments = new CommentTableAdapter().GetData();

foreach (var comment in comments)

{

sb1.Append(comment.name).Append("|").Append(comment.Comment).Append("$");

  }

  context.Response.Write(sb1.ToString().Trim('$'));

//Html页面:

$(function (){

$.post("GetComment.ashx",function(data,status){

if(status!="success"){

alert("加载评论失败!");

return;

}

else{

var comments=data.split("$");

for(var i=0;i<comments.length;i++){

var data=comments[i];

var content=data.split("|");

var li=$("<li>"+content[0]+"  "+content[1]+"</li>");

$("#ulComment").append(li);

}

}

});

});

Json

AJAX传递复杂数据,如果自己进行格式定义的话会经历组装,解析的过程,比较麻烦,因此,AJAX中有一个事实上的数据传输标准json。

Json将复杂对象序列化为一个字符串,在浏览器端再将字符串反序列化为Javascript可以读取的对象,看一下json的格式,json几乎被所有语言支持。

C#中将.net对象序列化为Json字符串的方法:

JavaScriptSerializer().Serialize(p) ;JavascriptSerializer在System.Web.Extensions.dll中,是.Net3.x中新增加的类,如果在.Net2.0中则需要用第三方的组件。

JavaScriptSerializer jss = new JavaScriptSerializer();

string json=jss.Serialize(new Person(){Name="杨凤辉",Age=22 });

//将一个.net对象序列化为一个json字符串。

Jquery AJAX得到的data是json格式数据,用$.parseJSON(data)方法将json格式数据解析为Javascript对象。

$(function(){

    $.post("JsonTest1.ashx",function(data,status){

     //alert(data);

      var person=$.parseJSON(data);

       alert(person.Name);//可打印出名字

})

AJAX的最后一个x,是XML的缩写,但是用xml表示一个类的对象,需要很长的内容,增加了流量,所以现在都是转用json来转送复杂内容。简单的内容就用string。 Xml已经失去了意义了。

微软asp.net提供的 AJAX控件updatapanel,放入scriptmanager,将要实现AJAX效果的控件放到updtapanel控件内即可。

该效果很傻瓜化:虽然页面没有刷新,但是页面内的所有viewstate,cs代码里面的每一个函数都会被触发,流量非常大。方便的开发,是要付出流量的代价的。所以内置的AJAX控件只是适用于对流量要求不高的项目,如公司内部使用的系统。

用Timer实现定时AJAX效果,原理:设置一个setInterval定时器,定时想服务器发送AJAX请求。

Global.asax

程序,session,Request等启动,关闭时,触发响应的事件,可以用来做一些网站功能。如:启动,关闭日志!

protected void Application_Start(object sender, EventArgs e)

{

File.AppendAllText("b:/log.txt",DateTime.Now.ToString()+"----Application_Start");

}

用户在线人数统计:

屏蔽对应ip地址的请求

protected void Application_BeginRequest(object sender, EventArgs e)

{

  if (HttpContext.Current.Request.UserHostAddress == "127.0.0.1")

    { //用屏蔽本机ip来做测试

     HttpContext.Current.Response.Write("该ip已被屏蔽!");

     HttpContext.Current.Response.End();

}

if (HttpContext.Current.Request.Url.AbsolutePath.EndsWith("jpg")&&HttpContext.Current.Request.Url.Host!="localhost")

{ //用屏蔽本机ip来做测试               HttpContext.Current.Response.WriteFile(Server.MapPath("~/img/jzdd.jpg"));//返回一个禁止盗链图片

HttpContext.Current.Response.End();

}

}

Asp.net异常处理,错误页和Application_Error()在这个方法里面,将异常记录下来!

protected void Application_Error(object sender, EventArgs e)//处理未抓获的错误信息。异常!

{

   Exception ee= HttpContext.Current.Server.GetLastError();

   File.AppendAllText("b:/errorLog.txt", ee.Message + "--" + ee.StackTrace);

}

URL重写

为什么要url重写?

  1. 有利于被搜索引擎检索到(SEO),带参数的RUL权重较低;
  2. 地址栏看起来更正规,推广uid,看看如鹏网的URL重写!

伪静态:看起来像普通的页面,而非动态生成的页面。

 原理:在Global.aspx的Application_Beginrequest()中兑取Request.url得到请求的url(View-3.aspx),然后用HttpContext.Current.RewritePath(RewirteUrl)重写。

(View.aspx?id=3格式)http://www.cnblogs.com/hd/archive/2005/06/20/177633.html

也可以使用微软的URLReWrite,只要修改配置文件就可以进行url重写。照着文档自学配置。见备注!

抱歉!评论已关闭.