Ajax向服务器发送请求和接收返回的信息

Ajax向服务器发送请求

Ajax对象创建完成后，下面就要讲解一下Ajax如何使用。首先详细讲解一下Ajax向服务器发送请求所需的两个方法，具体如下：

(1)open()方法

open()方法用于创建一个新的HTTP请求，并指定此请求的类型(如GET、POST等)、URL以及验证信息，其声明方式如下所示：

在上述声明中，method用于指定请求的类型，其值可为POST、GET、PUT及PROPFIND，大小写不敏感;URL表示请求的地址，可以为绝对地址也可以为相对地址，并且可以传递查询字符串。其余参数为可选参数，其中，asyncFlagy用于指定请求方式，同步请求为false，默认为异步请求true;userName用于指定用户名，password用于指定密码。

(2)send()方法

send()方法用于发送请求到HTTP服务器并接收回应。其声明方式如下所示：

在上述声明中，content用于指定要发送的数据，其值可为DOM对象的实例、输入流或字符串，一般与POST请求类型配合使用，需要注意的是，如果请求声明为同步，该方法将会等待请求完成或者超时才会返回，否则此方法将立即返回。

需要注意的是，在使用GET方式传递特殊字符或中文参数时，要使用JavaScript中的encodeURIComponent()函数将其转换成“%十六进制数”的形式，防止在某些浏览器(如IE浏览器)中中文乱码的问题。

Ajax接收服务器返回的信息

了解Ajax向服务器发送请求后，下面将对Ajax如何接收服务器返回的信息(例如，HTML标签、CSS样式、字符串、XML、JSON等)，进行详细讲解。具体如下：

(1)readyState属性

readyState属性用于返回Ajax的当前状态，状态值有5种形式，具体如表所示。

(2)onreadystatechange属性

onreadystatechange事件属性用于感知readyState属性状态的改变。为了大家更好的理解这两个属性的使用，下面创建一个服务器端的文件indexphp，用于输出字符串，然后在浏览器端indexhtml中向服务器端发送请求，并在控制台输出状态值。具体示例如下所示：

创建服务器端文件：indexphp

创建浏览器端文件：indexhtml

在浏览器中访问客户端文件，按“F12”键，切换到控制台，查看输出结果，具体如下图所示。

从图中可以看出，通过onreadystatechange事件属性可以清晰的感知Ajax状态的改变，同时使用readyState获取转变后的状态值。例如Ajax从0(未初始化)状态变成1(初始化)状态值时，Ajax此时的状态值为1。

(3)status属性

status属性用于返回当前请求的HTTP状态码，常见的状态码如表所示。

值得一提的是，在感知当前Ajax对象状态时，为了追求程序的严谨性，需要同时判断当前HTTP状态status是否等于200(请求成功)。

需要注意的是，Ajax中的statusText属性，仅当数据发送并接收完毕后，才可以获取当前请求的响应状态。

(4)获取响应信息的相关属性

当数据接收完毕且请求服务器的请求成功时，即可以使用Ajax中提供的相关属性获取服务器的响应信息。具体的属性及相关说明如下表所示。

在上表中，responseText属性用于返回文本格式的响应数据;属性responseBody表示直接从服务器返回并未经解码的二进制数据;responseXML属性用于接收XML数据格式的响应数据。

Web Service接口方法

　　　[WebMethod]

public string Project(string paramaters)

{

return paramaters;

}

实现代码

public string Post(string methodName, string jsonParas)

{

string strURL = Url + "/" + methodName;

//创建一个HTTP请求

HttpWebRequest request = (HttpWebRequest)WebRequestCreate(strURL);

//Post请求方式

requestMethod = "POST";

//内容类型

requestContentType = "application/x-www-form-urlencoded";

//设置参数，并进行URL编码

//虽然我们需要传递给服务器端的实际参数是JsonParas(格式：[{\"UserID\":\"0206001\",\"UserName\":\"ceshi\"}])，

//但是需要将该字符串参数构造成键值对的形式（注："paramaters=[{\"UserID\":\"0206001\",\"UserName\":\"ceshi\"}]"），

//其中键paramaters为WebService接口函数的参数名，值为经过序列化的Json数据字符串

//最后将字符串参数进行Url编码

string paraUrlCoded = SystemWebHttpUtilityUrlEncode("paramaters");

paraUrlCoded += "=" + SystemWebHttpUtilityUrlEncode(jsonParas);

byte[] payload;

//将Json字符串转化为字节

payload = SystemTextEncodingUTF8GetBytes(paraUrlCoded);

//设置请求的ContentLength

requestContentLength = payloadLength;

//发送请求，获得请求流

Stream writer;

try

{

writer = requestGetRequestStream();//获取用于写入请求数据的Stream对象

}

catch (Exception)

{

writer = null;

ConsoleWrite("连接服务器失败!");

}

//将请求参数写入流

writerWrite(payload, 0, payloadLength);

writerClose();//关闭请求流

String strValue = "";//strValue为http响应所返回的字符流

HttpWebResponse response;

try

{

//获得响应流

response = (HttpWebResponse)requestGetResponse();

}

catch (WebException ex)

{

response = exResponse as HttpWebResponse;

}

Stream s = responseGetResponseStream();

//服务器端返回的是一个XML格式的字符串，XML的Content才是我们所需要的Json数据

XmlTextReader Reader = new XmlTextReader(s);

ReaderMoveToContent();

strValue = ReaderReadInnerXml();//取出Content中的Json数据

ReaderClose();

sClose();

return strValue;//返回Json数据

}

Url的格式样例："http://596829106:8087/IFT_Projectasmx"

　　methodName参数就是"Project"

　　JsonParas就是使用C# JavaScriptSerializer将List<Object>类型的对象序列化之后得到的值，数据格式：[{\"UserID\":\"0206001\",\"UserName\":\"ceshi\"}]，Json数据中的中括号代表由着多个对象集合序列化，花括号代表一个对象序列化得到的结果，花括号里面的内容使用键值对的方式展示，多个属性之间用逗号隔开，每个对象也用逗号隔开。

　　requestContentType必须设置值，建议使用"application/x-www-form-urlencoded"，设置其他值就很容易报服务器内部异常，使用这种方式服务接口方法返回的是xml格式的字符串

　　payload将请求参数转换成二进制来保存，此处一定要将“paramaters”加入其中，不然会报异常缺少参数，paramaters就是服务接口函数的参数名。函数中使用了URL编码，注意在编码的时候只需要将键和值进行编码，不要将中间的=进行编码，不然getResponse的时候会报异常。

　　requestContentLength也是必须设置的值

　　在得到响应流之后Stream s = responseGetResponseStream();需要使用Reader来解析响应流，这个地方我使用的是XmlTextReader，因为我服务方法返回的是xml格式的字符串，其中Json数据在xml的Content中。在取出Json数据之后，再进行相应的反序列化即可得到对象。

一、使用js获取接口数据的方法

①$get(url,[data],[callback])

url:请求的地址;data:请求数据的列表;callback:请求成功后的回调函数,该函数接受两个参数,第一个为服务器返回的数据,第二个为服务器的状态,是可选参数。

其中服务器返回数据的格式其实是字符串形式,并不是我们想要的JSON数据格式。上例子：

var url3 = 'http://mshopgemstccom/ApiService/msggetphp';

$get(url3,function(data){

alert(data);

});

此时如果对data采用json解析数据，得到的值为undefined。所以我们使用这种get方法获取到的值要是JSON格式，需要定义获取的数据类型为json格式，上例子：

var url3 = 'http://mshopgemstccom/ApiService/msggetphp';

$get(url3,function(data){

$('#result')append('

interval:'+dataname+'

') //此时返回的是JSON格式的内容，例：我们可以使用dataname获取到name字段的值并输出。

}, 'json');

②$post(url,[data],[callback],[type])

post方法中多了一个type：获取数据的类型格式，post其实和get是一样的用法，type不定义，返回的是字符串类型的，定义为json格式，返回的就是json格式的数据，此处可以仿照上面的get方法，把get改成post就搞定了，就不多说了。

Lz您好！请不要担心，最近因为空间正在进行升级优化，很多用户都会遇到，物品突然减少，空间打不开，显示错误，车位丢失，好友突然减少，金币减少,QQ系统繁忙,空间网页,导航 播放器, 模块不能显示,游戏应用不能打开,日志看不到装扮无法保存QQ签名挡不能改QQ面板显示不出QQ空间，QQ空间的图标不亮

闪图不会闪,空间歌播放不流畅或者验证码一直出错之类的问题这个要刷新之后就能恢复，升级完成之后也就会恢复正常。恢复正常之后会补贴你的损失的。一定要耐心等候哦 ！系统有些差错，请玩家们不要太过于担心;

json数据格式解析我自己分为两种；

一种是普通的，一种是带有数组形式的；

普通形式的：

服务器端返回的json数据格式如下：

复制代码代码如下:

{"userbean":{"Uid":"100196","Showname":"\u75af\u72c2\u7684\u7334\u5b50","Avtar":null,"State":1}}

分析代码如下：

复制代码代码如下:

// TODO 状态处理 500 200

int res = 0;

res = httpClientexecute(httpPost)getStatusLine()getStatusCode();

if (res == 200) {

/

当返回码为200时，做处理

得到服务器端返回json数据，并做处理

/

HttpResponse httpResponse = httpClientexecute(httpPost);

StringBuilder builder = new StringBuilder();

BufferedReader bufferedReader2 = new BufferedReader(

new InputStreamReader(httpResponsegetEntity()getContent()));

String str2 = "";

for (String s = bufferedReader2readLine(); s != null; s = bufferedReader2

readLine()) {

builderappend(s);

}

Logi("cat", ">>>>>>" + buildertoString());

JSONObject jsonObject = new JSONObject(buildertoString())

getJSONObject("userbean");

String Uid;

String Showname;

String Avtar;

String State;

Uid = jsonObjectgetString("Uid");

Showname = jsonObjectgetString("Showname");

Avtar = jsonObjectgetString("Avtar");

State = jsonObjectgetString("State");

带数组形式的：

服务器端返回的数据格式为：

复制代码代码如下:

{"calendar":

{"calendarlist":

[

{"calendar_id":"1705","title":"(\u4eb2\u5b50)ddssd","category_name":"\u9ed8\u8ba4\u5206\u7c7b","showtime":"1288927800","endshowtime":"1288931400","allDay":false},

{"calendar_id":"1706","title":"(\u65c5\u884c)","category_name":"\u9ed8\u8ba4\u5206\u7c7b","showtime":"1288933200","endshowtime":"1288936800","allDay":false}

]

}

}

分析代码如下：

复制代码代码如下:

// TODO 状态处理 500 200

int res = 0;

res = httpClientexecute(httpPost)getStatusLine()getStatusCode();

if (res == 200) {

/

当返回码为200时，做处理

得到服务器端返回json数据，并做处理

/

HttpResponse httpResponse = httpClientexecute(httpPost);

StringBuilder builder = new StringBuilder();

BufferedReader bufferedReader2 = new BufferedReader(

new InputStreamReader(httpResponsegetEntity()getContent()));

String str2 = "";

for (String s = bufferedReader2readLine(); s != null; s = bufferedReader2

readLine()) {

builderappend(s);

}

Logi("cat", ">>>>>>" + buildertoString());

/

这里需要分析服务器回传的json格式数据，

/

JSONObject jsonObject = new JSONObject(buildertoString())

getJSONObject("calendar");

JSONArray jsonArray = jsonObjectgetJSONArray("calendarlist");

for(int i=0;i<jsonArraylength();i++){

JSONObject jsonObject2 = (JSONObject)jsonArrayopt(i);

CalendarInfo calendarInfo = new CalendarInfo();

calendarInfosetCalendar_id(jsonObject2getString("calendar_id"));

calendarInfosetTitle(jsonObject2getString("title"));

calendarInfosetCategory_name(jsonObject2getString("category_name"));

calendarInfosetShowtime(jsonObject2getString("showtime"));

calendarInfosetEndtime(jsonObject2getString("endshowtime"));

calendarInfosetAllDay(jsonObject2getBoolean("allDay"));

calendarInfosadd(calendarInfo);

}

总结，普通形式的只需用JSONObject ，带数组形式的需要使用JSONArray 将其变成一个list。