HTTP服务&AJAX编程

即 Asynchronous Javascript And XML,AJAX 不是一门的新的语言,而是对现有持术的综合利用。

本质是在HTTP协议的基础上以异步的方式与服务器进行通信。

传统方式我们是以表单形式与服务器通信的。

1.1   异步

指某段程序执行时不会阻塞其它程序执行,其表现形式为程序的执行顺序不依赖程序本身的书写顺序,相反则为同步。

其优势在于不阻塞程序的执行,从而提升整体执行效率。

现实生活中的一个例子

打电话时同步 发消息是异步

XMLHttpRequest可以以异步方式的处理程序。

1.2   XMLHttpRequest

浏览器内建对象,用于在后台与服务器通信(交换数据) ,由此我们便可实现对网页的部分更新,而不是刷新整个页面。

下面是一个简单的例子

由于XMLHttpRequest本质基于HTTP协议实现通信,所以结合HTTP协议和上面的例子我们分析得出如下结果:

1.2.1    请求

HTTP请求3个组成部分与XMLHttpRequest方法的对应关系

1、请求行

2、请求头

get请求可以不设置

3、请求主体

注意书写顺序

1.2.2    响应

HTTP响应是由服务端发出的,作为客户端更应关心的是响应的结果。

HTTP响应3个组成部分与XMLHttpRequest方法或属性的对应关系。

由于服务器做出响应需要时间(比如网速慢等原因),所以我们需要监听服务器响应的状态,然后才能进行处理。

onreadystatechangeJavascript的事件的一种,其意义在于监听XMLHttpRequest的状态

1、获取状态行(包括状态码&状态信息)

2、获取响应头

3、响应主体

我们需要检测并判断响应头的MIME类型后确定使用request.responseText或者request.responseXML

1.2.3    API详解

xhr.open() 发起请求,可以是get、post方式

xhr.setRequestHeader() 设置请求头

xhr.send() 发送请求主体get方式使用xhr.send(null)

xhr.onreadystatechange = function () {} 监听响应状态

xhr.readyState = 0时,UNSENT open尚未调用

xhr.readyState = 1时,OPENED open已调用

xhr.readyState = 2时,HEADERS_RECEIVED 接收到头信息

xhr.readyState = 3时,LOADING 接收到响应主体

xhr.readyState = 4时,DONE 响应完成

不用记忆状态,只需要了解有状态变化这个概念

xhr.status表示响应码,如200

xhr.statusText表示响应信息,如OK

xhr.getAllResponseHeaders() 获取全部响应头信息

xhr.getResponseHeader(‘key‘) 获取指定头信息

xhr.responseText、xhr.responseXML都表示响应主体

注:GETPOST请求方式的差异(面试题)

1、GET没有请求主体,使用xhr.send(null)

2、GET可以通过在请求URL上添加请求参数

3、POST可以通过xhr.send(‘name=itcast&age=10‘)

4、POST需要设置

5、GET效率更好(应用多)

6、GET大小限制约4K,POST则没有限制

问题?如何获取复杂数据呢?

1.2.4    XMLHttpRequest2.0

技术总是在实践中不断更新的,XMLHttpRequest也不例外

1、可以设置超时

2、支持FormData对象管理表单数据

3、支持二进制(文件上传)

4、支持上传进度

1.3   JSON

即 JavaScript Object Notation,另一种轻量级的文本数据交换格式,独立于语言。

1.3.1    语法规则

1、数据在名称/值对中

2、数据由逗号分隔(最后一个健/值对不能带逗号)

3、花括号保存对象方括号保存数组

4、必须要使用双引号

1.3.2    JSON解析

JSON数据在不同语言进行传输时,类型为字符串,不同的语言各自也都对应有解析方法,需要解析完成后才能读取

1Javascript 解析方法

eavl()、JSON对象  JSON.parse()、JSON.stringify();

JSON兼容处理json2.js

2PHP解析方法

json_encode()、json_decode()

总结:JSON体积小、解析方便且高效,在实际开发成为首选。

1.4   兼容性

IE5、IE6中使用 ActiveObject("Microsoft.XMLHTTP")

如下图

关于IE的兼容方面,了解即可。

1.5   jQuery中的Ajax

jQuery为我们提供了更强大的Ajax封装

$.ajax({}) 可配置方式发起Ajax请求

$.get() 以GET方式发起Ajax请求

$.post() 以POST方式发起Ajax请求

$(‘form‘).serialize() 序列化表单(即格式化key=val&key=val)

url 接口地址

type 请求方式

timeout 请求超时

dataType 服务器返回格式

data 发送请求数据

beforeSend: function () {} 请求发起前调用

success 成功响应后调用

error 错误响应时调用

complete 响应完成时调用(包括成功和失败)

jQuery Ajax介绍

http://www.css88.com/jqapi-1.9/

第2章JSONP

2.1   JSONP

JSON with Padding

1、原理剖析

其本质是利用了<script src=""></script>标签具有可跨域的特性,由服务端返回一个预先定义好的Javascript函数的调用,并且将服务器数据以该函数参数的形式传递过来,此方法需要前后端配合完成。

只能以GET方式请求

2.2   jQuery中的JSONP

jQuery 的$.ajax() 方法当中集成了JSONP的实现,可以非常方便的实现跨域数据的访问。

dataType: ‘jsonp‘ 设置dataType值为jsonp即开启跨域访问

jsonp 可以指定服务端接收的参数的“key”值,默认为callback

jsonpCallback 可以指定相应的回调函数,默认自动生成

http://ued.taobao.org/blog/2014/04/full-stack-development-with-nodejs/

时间: 2024-10-13 11:42:12

HTTP服务&AJAX编程的相关文章

ajax编程

即 Asynchronous [e's??kr?n?s] Javascript And XML, AJAX 不是一门的新的语言,而是对现有技术的综合利用. 本质是在HTTP协议的基础上以异步的方式与服务器进行通信. 1. 异步 指某段程序执行时不会阻塞其它程序执行,其表现形式为程序的执行顺序不依赖程序本身的书写顺序,相反则为同步. 其优势在于不阻塞程序的执行,从而提升整体执行效率. XMLHttpRequest可以以异步方式的处理程序. 2. XMLHttpRequest 浏览器内建对象,用于在

AJAX编程-封装ajax工具函数

即 Asynchronous [e's??kr?n?s] Javascript And XML,AJAX 不是一门的新的语言,而是对现有技术的综合利用.本质是在HTTP协议的基础上以异步的方式与服务器进行通信. XMLHttpRequest可以以异步方式的处理程序,浏览器内建对象,用于在后台与服务器通信(交换数据) ,由此我们便可实现对网页的部分更新,而不是刷新整个页面. 封装ajax工具函数 $.ajax = function(options){ if(!options) return fal

ACE服务端编程3:ACE跨平台之分配堆内存

ACE服务端编程系列的第三篇,探究ACE解决不同编译器之间分配堆内存的差异. 在ACE的官方示例中会看到大量的ACE_NEW_RETURN,ACE_NEW这样的宏,这是ACE为了消除不同编译器编译的代码在堆上分配内存失败的行为差异. 具体来说: 使用 malloc/calloc 等分配内存的函数时,一定要检查其返回值是否为“空指针”(亦即检查分配内存的操作是否成功),这是良好的C++编程习惯,也是编写可靠服务端程序所必需的. 如果使用 new 分配内存失败时,C++标准的规定是抛出异常,如果想检

苹果推送通知服务APNs编程(转)

add by zhj: 下面的几篇文章也非常好, http://www.raywenderlich.com/32960/apple-push-notification-services-in-ios-6-tutorial-part-1 http://www.raywenderlich.com/32963/apple-push-notification-services-in-ios-6-tutorial-part-2 http://blog.csdn.net/chenglibin1988/art

《Linux多线程服务端编程——使用muduo C++网络库》学习笔记

第一章 线程安全的对象生命期管理 第二章 线程同步精要 第三章 多线程服务器的适用场合与常用编程模型 第四章 C++多线程系统编程精要 1.(P84)11个常用的最基本Pthreads函数: 2个:线程的创建和等待结束(join).封装为muduo::Thread 4个:mutex的创建.销毁.加锁.解锁.封装为muduo::MutexLock 5个:条件变量的创建.销毁.等待.通知.广播.muduo::Condition 2.(P85)不推荐使用读写锁的原因是它往往造成提高性能的错觉(允许多个

Ajax编程中,经常要能动态的改变界面元素的样式

在Ajax编程中,经常要能动态的改变界面元素的样式,可以通过对象的style属性来改变,比如要改变背景色为红色,可以这样写:element.style.backgroundColor=”#ff0000”;其中style 对象有很多属性,基本上CSS 里拥有的属性在JavaScript 中都能够使用.现在考虑,如果一个函数接收参数,用以指定一个界面元素的样式,那就需要设计参数的实现方式,显然一个或几个参数是不能符合要求的,下面是一种实现:function setStyle(_style){//得到

JavaWeb ajax编程(未完待续)

1.Ajax 1.1Ajax的定义 Ajax:(Asynchronous JavaScript And XML)指异步 JavaScript 及 XML. 不是一种新的编程语言,而是一种用于创建更好更快以及交互性更强的 Web 应用程序的技术,是基于JavaScript.XML.HTML.CSS新用法. Ajax:只刷新局部页面的技术 JavaScript:更新局部的网页 XML:一般用于请求数据和响应数据的封装 XMLHttpRequest对象:发送请求到服务器并获得返回结果 CSS:美化页面

AJAX编程实践

---------------------------------------------------------------------------------------------------------------[版权申明:本文系作者原创,转载请注明出处]文章出处:http://blog.csdn.net/sdksdk0/article/details/51727377作者:朱培   ID:sdksdk0-----------------------------------------

Linux多线程服务端编程:使用muduo C++网络库

内容推荐本 书主要讲述采用现代C++在x86-64 Linux上编写多线程TCP网络服务程序的主流常规技术,重点讲解一种适应性较强的多线程服务器的编程模型,即one loop per thread.这是在Linux下以native语言编写用户态高性能网络程序最成熟的模式,掌握之后可顺利地开发各类常见的服务端网络应用程序.本书以 muduo网络库为例,讲解这种编程模型的使用方法及注意事项.本书的宗旨是贵精不贵多.掌握两种基本的同步原语就可以满足各种多线程同步的功能需求,还能写出更易用的同步设施.掌