zoukankan      html  css  js  c++  java
  • 【ajax】1、ajax原理

    Ajax核心XMLHttpRequest对象

    XMLHttpRequest对象方法

    XMLHttpRequest对象属性

    onreadystatechange 状态改变的事件触发器。每次 readyState 属性的改变都会触发 readystatechange事件

    readyState 属性表示Ajax请求的当前状态。它的值用数字代表。

    0 代表未初始化。 还没有调用 open 方法

    1 代表正在加载。 open 方法已被调用,但 send 方法还没有被调用

    2 代表已加载完毕。send 已被调用。请求已经开始

    3 代表交互中。服务器正在发送响应

    4 代表完成。响应发送完毕

    AJAX运行流程

    整个Ajax技术紧紧围绕在XMLHttpRequest对象周围
    (1)创建XMLHttpRequest对象,XMLHttpRequest对象的作用如同名字所暗示的,允许通过客户端脚本来发送HTTP请求。
    (2)XMLHttpRequest打开连接并发送数据
      服务器端响应处理阶段
    (3)XMLHttpRequest获得服务器端响应状态。XMLHttpRequest对象也是一个普通的JavaScript对象,如一个普通按钮或一个普通文本框一样,可以触发事件;而XMLHttpRequest触发的事件就是onreadystatechange,当XMLHttpRequest对象的状态改变时,将触发它。为XMLHttpRequest对象的onreadystatechange事件指定事件处理函数,该函数将在XMLHttpRequest状态改变时被执行,这个事件处理函数也叫回调函数(XMLHttpRequest状态改变,且readyState=4&&status=200时,表明服务器响应已经完成且是正确的响应状态,此时可以开始处理服务器响应)
    (4)客户端处理函数执行。进入事件处理函数后,XMLHttpRequest依然不可或缺,事件处理函数借助于XMLHttpRequest的responseText或responseXML属性获取服务器的响应,至此XMLHttpRequest运行周期结束;JavaScript通过DOM操作将响应动态加载到XHMTL页面中。
    整个过程,从发送HTTP请求到监控服务器的响应状态,到获取响应数据,XMLHttpRequest一直是Ajax技术的灵魂。

    GET 还是 POST?

    与 POST 相比,GET 更简单也更快,并且在大部分情况下都能用。

    然而,在以下情况中,请使用 POST 请求:

    • 无法使用缓存文件(更新服务器上的文件或数据库)
    • 向服务器发送大量数据(POST 没有数据量限制)
    • 发送包含未知字符的用户输入时,POST 比 GET 更稳定也更可靠

    POST 请求示例:

    xmlhttp.open("POST","demo_post.asp",true);
    xmlhttp.send();
  • 相关阅读:
    设计模式:面向对象设计的六大原则 (绝对详细)
    idea创建maven项目速度慢?别急,这有三种方案
    Spring Cloud开发人员如何解决服务冲突和实例乱窜?
    Spring Cloud Zuul的动态路由怎样做?集成Nacos实现很简单
    Spring Boot自定义配置实现IDE自动提示
    阿里注册中心Nacos生产部署方案
    日志排查问题困难?分布式日志链路跟踪来帮你
    zuul集成Sentinel最新的网关流控组件
    YAML中多行字符串的配置方法
    JetBrains 第二轮:再为免费全家桶续命三个月
  • 原文地址:https://www.cnblogs.com/wangzhongqiu/p/6656070.html
Copyright © 2011-2022 走看看