使用该方式必须设置自定义请求头部信息Content-Type,以说明请求的内容类型。这样服务器就会根据请求的内容类型来解析表单中的数据。
在通过post方式请求表单中,在open和send之间,要添加request.setRequestHeader(“Content-Type”,”application/x-www-form-urlencoded”)
如果不设置content-type头部,那么发送给服务器的数据就不会出现在$_POST超级全局变量中。
在来看看新一代的XHR即XHR2级对象又提供了哪些方法吧。
XHR2级对象1. FormData类型
用于将表单数据序列化和创建和表单格式相同的数据:
方式一:
var data = new FormData();
data.append(“key”,”value”);
方式二:
var data = new FormData(form对象);
以上代码应该在open和send(data)之间。
2. overrideMimeType(“text/xml”)方法
重写服务器返回的MIME类型。强迫XHR对象将响应当做XML而非纯文本来处理
3.超时设定(IE8+支持)
XHR对象支持timeout属性和ontimeout事件处理程序。timeout属性用于设置请求等待响应的时间,若超出了则终止请求,然后触发timeout事件,调用ontimeout事件处理程序。
终止请求后readyState属性可能已经为4了,但是如果终止请求后再访问status属性(响应状态码)会报错,因此可将访问该属性的代码用try、catch括起来。
那么我们通过XHR对象传递的数据都有哪些格式呢?下面再来看看常用的几种数据格式。
传送的数据格式 1.XMLXML是一种数据格式,在异步应用程序中常有以下两种用法:
一是以XML格式从网页发送HTTP请求给服务器
二是以XML格式在网页中接收服务器的响应
客户端发送请求
XML格式的请求和响应比普通文本慢,消耗内存更多,因为要添加标签和语义。
将数据包装为XML格式其实也是使用字符串的形式,不过字符串中有相应的标签。即发送的数据都必须是文本。
以XML格式化数据时应先设置请求头部:
xhr.setRequestHeader(“Content-type”,”text/xml”)。若果是发送普通文本则类型为text/plain
最好是使用普通文本的方式发送请求数据。
发送文本格式的请求(名/值对)和发送XML格式包装后的数据例子讲解:
服务器发送响应
比较适合用XML格式的数据,原因是若发送的响应为文本,其中包含多个名称/值对,服务器程序用某种符号连接这些对儿(没有一个标准),而客户端必须采取措施将这些响应文本(字符串)中的对儿依次解析出来。(而服务器端技术提供了多种方法来根据名称获取值,所以客户端发送请求时适合用名称/值对这种方式)。
XML响应可以是以XML格式化的纯文本,客户端中通过xhr.responseText属性来获取,这时仍出现了需要解析字符串的问题,所以不应该以这种方式来发送XML响应。应当使用XML文档,客户端可通过xhr.responseXML获取,将该文档当成一个DOM Document对象,在客户端可以利用DOM来解析该文档。
**json基本概念和格式
当需要在客户端和服务器端之间传递大量数据时,使用Jason格式的数据会很灵活,便于解析。
Json是一种存储和交换文本信息的语法,采用键值对方式组织。Json是独立于语言的,可被任何语言解析和生成。
json和XML相比有这样一些优点:
长度短小,读写速度更快;可以使用JavaScript内建的方法进行解析,也可以直接转换成JavaScript对象,非常方便。
json数据的书写格式为名称-值这样的对儿:
注意名称有引号,当value为字符串时也应该加引号。
value的数据类型可为:
举一个json文件的例子:
最外层的大括号{}表示这是一个json对象。
**在JS中解析json
通过下述几种方式可以把一个json字符串解析为一个JavaScript对象。
(1)使用eval()解析
可以浏览器控制台中进行如下代码测验:
采用eval,不仅会解析成一个JavaScript对象,还会执行json字符串中的方法,例如把”age”:20改为”age”:alert(“hello”),则会执行这个alert语句。
(2)使用JSON.parse()解析
var jsonobj=JSON.parse(jsondata);使用这种方式解析不会执行json字符串中的方法,会报错,json字符串语法不合法。
由于eval方法不会检查语法,这样很危险,如果接收的json数据中包含恶意代码会被执行。
检查json语法的格式化校验在线工具:jsonlint.com
readyStateChange事件补充说明该事件的作用是提供了与文档或元素的加载状态有关的信息。支持该事件的对象都有一个readyState属性。该属性有如下几个值:
uninitialized(未初始化):对象存在但尚未初始化
loading(正在加载):对象正在加载数据
loaded:对象加载数据完成
interactive:可以操作对象了,但韩没有完全加载
complete:对象已经加载完毕
并非所有的对象都会经历这几个阶段。