• AJAX笔记


    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重写。照着文档自学配置。见备注!

    作者:GY小小鸟
             
    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
  • 相关阅读:
    POJ 1015 Jury Compromise【DP】
    POJ 1661 Help Jimmy【DP】
    HDU 1074 Doing Homework【状态压缩DP】
    HDU 1024 Max Sum Plus Plus【DP,最大m子段和】
    占坑补题。。最近占的坑有点多。。。
    Codeforces 659F Polycarp and Hay【BFS】
    Codeforces 659E New Reform【DFS】
    Codeforces 659D Bicycle Race【计算几何】
    廖大python实战项目第四天
    廖大python实战项目第三天
  • 原文地址:https://www.cnblogs.com/YangFengHui/p/2025710.html
Copyright © 2020-2023  润新知