AJax技术

Ajax学习小结

字号+ 作者:H5之家 来源:H5之家 2017-09-15 09:01 我要评论( )

Ajax学习小结

1 同步和异步的基础:XHR


2 XHR对象创建

        var request;

        if(window.XMLHttpRequest) {

            request = new XMLHttpRequest();

        } else {

            request = new ActiveXObjext("Microsoft.XMLHttp"); // IE5&6

        }


3 HTTP请求(无状态协议)

7个步骤:

    1 建立TCP连接

    2 Web浏览器想Web服务器发送请求命令

    3 Web浏览器发送请求头信息

    4 Web服务器应答

     5 Web服务器发送应答头信息

    6 Web服务器向浏览器发送数据

    7 Web服务器关闭TCP连接

HTTPt请求:  

    Get:信息获取

    Post:修改服务器上资源(提交数据)

HTTP响应:

    1 一个数字和文字组成的状态码(表示请求成功或失败)

    2 响应头

    3 响应体

响应状态码:

    1XX:信息类,表示收到Web浏览器请求,正在进一步处理中

    2XX:成功,表示用户请求被正确接收,理解和处理例如(200 OK)

    3XX:重定向,表示请求没有成功,客户必须采取进一步措施

    4XX:客户端错误,表示客户端提交的请求有错误(例如:404 Not Found),意味请求中所引用的文档不存在

    5XX:服务器错误,表示服务器不能完成对请求的处理(例如:500)


4 XHR请求

open(method, url, async) send(string) request.open("GET", "get.php", true); request.send(); request.open("POST", "post.php", true); request.send(); request.open("POST", "create.php", true); request.setRequestHeader("Content-type", "appliction/x-www-form-urlencoded"); request.send("name=XXX&sex=男");


5 XHR取得响应

    responseText:获得字符串形式的响应数据

    responseXML:获得XML形式的响应数据

    status和statusText:返回HTTP请求的数字状态和文本内容

    getAllResponseHeader():获得所有的响应头

    getResponseHeader():查询响应中某个字段的值


6 readyState属性

    0:请求未初始化,open还没有调用

    1:服务器连接已建立,open已经调用

    2:请求已接收(接收到头信息)

    3:请求处理中(接收到响应体)

    4:请求已完成(响应就绪,即响应完成)


7 如何监听readyState

var request = new XMLHttpRequest(); request.open("GET", "get.php", true); request.send(); request.onreadystatechange = function() {     // 请求完成,响应成功     if(request.readyState === 4 && request.status === 200) {         // 其他 request.responseText;     } }


8 运行PHP

    XAMPP软件包:https://www.apachefriends.org/download.html

    DW中配置Web服务器用于本地测试

注意点:

    7.1 安装XAMMP时可能需要关闭UAC(用户账户控制):运行、msconfig、工具、更改UAC设置(启动)滑到最底下

    7.2 端口80被ISS占用,进入控制面板-管理工具-服务,将World Wide Web Publishing Service停止即可,或者在Xampp Apache的设置中将配置文件httpd.conf的端口改为8088或其他

    7.3 如果以前安装过,配置路径被老版本给占用没有修改该为新版本路径,那么需要在进入注册表修改环境变量path:win+r打开运行对话框--->输入regedit回车,进入注册表--->点击HKEY_LOCAL_MACHINE---->SYSTEM---->currentControlSet---->Services---->找到Apache2.4,你就会在右边款到ImagePath看看那个路径是不是以前那个版本的路径,修改为新版本路径即可---->重启xampp(MySQL、FileZilla、Mercury、Tomcat如有同样的问题解决方法相同)


附:Fiddler的使用

get:

    Composer-添加url-Execute-双机左边列表栏的地址

post:

    添加Content-Type:application/x-www-form-urlencoded

    RequestBody中添加:提交参数

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
网友点评