在现代Web开发中，AJAX技术被广泛用于创建动态和交互性强的应用程序。本文将介绍如何使用AJAX技术在ASP.NET环境中实现一个一对一的聊天应用。虽然本文的示例是一个一对一的聊天应用，但通过简单的修改，它也可以支持多用户聊天。
在本聊天应用中，不维护额外的用户信息，例如在用户注册时不使用验证码或其他安全措施。主要的AJAX通信代码与之前文章中介绍的AJAXDemo.aspx中的代码相同。在聊天应用中，某些数据（例如RequestCode、用户名、密码）通过HTTP头部发送，而某些数据（如消息和用户列表）则正常地在内容中发送。
这个演示应用程序是一个ASP.NETWeb应用程序，它使用Microsoft SQL数据库来存储用户消息和登录信息。数据库文件.mdf包含在APP_Data文件夹中，而DatabaseScript.sql文件包含设置新数据库的所有数据库脚本。目前，已注释掉维护消息历史的存储过程代码，但如果需要，可以启用它。
浏览器到服务器再到浏览器的通信流程如下：
RequestCode。以下是JavaScript中用于轮询消息和在线用户的时间间隔变量：
var MessagePollingInterval = 3000; // 消息轮询间隔
var OLUsersPollingInterval = 9000; // 在线用户轮询间隔
这些变量保存轮询间隔。消息以加密方式在服务器和客户端之间交换。应用程序中使用的加密/解密算法是简单的替换密码。
以下是JavaScript中的加密和解密函数：
function Encrypt(PlainText, Key) {
var to_enc = PlainText.toString().replace(/^\n+/, "").replace(/\n+$/, "");
var xor_key = Key;
var the_res = "";
for (var i = 0; i < to_enc.length; ++i) {
if (to_enc.charCodeAt(i) <= 32) {
the_res += String.fromCharCode(to_enc.charCodeAt(i));
} else {
the_res += String.fromCharCode((to_enc.charCodeAt(i)) - Key);
}
}
return the_res;
}
function Decrypt(CipherText, Key) {
var to_dec = CipherText;
var xor_key = Key;
var PlainText = "";
for (var i = 0; i < to_dec.length; i++) {
if (to_dec.charCodeAt(i) <= 32) {
PlainText += String.fromCharCode(to_dec.charCodeAt(i));
} else {
PlainText += String.fromCharCode((to_dec.charCodeAt(i)) + Key);
}
}
return PlainText;
}
服务器端处理程序中实现了类似的函数以执行加密/解密。
以下是JavaScript中发送消息的函数：
function SendMessage() {
if (ValidateSendMessageWindow()) {
var URL = "SecureChatServer.ashx";
var covert = "False";
if (URL == null) {
alert("Request URL is Empty");
} else {
var HTMLmessage = document.getElementById('Message').value.toString().replace(/\r\n?/g, '');
var message = Encrypt(HTMLmessage, EncryptionKey);
var recepient = Encrypt(document.getElementById('Recepient').value, EncryptionKey);
AjaxRequest(ProcessSendMessageResponse, URL, "POST", {Message: message, Recepient: recepient}, '', {RequestCode: 'SC005'});
}
}
}
所有必要的数据都传递给AjaxRequest函数，该函数将数据发送到通用处理程序SecureChatServer.ashx。
以下是处理RequestCode: SC005的代码：
LoggedInUser = userlogin.IsUserLoggedIn(SessionID, UserIPAddress);
if (LoggedInUser != null) {
var newMessage = new Messages();
var Message = Decrypt(context.Request.Params["Message"], EncryptionKey);
var Recepient = Decrypt(context.Request.Params["Recepient"], EncryptionKey);
if (newMessage.WriteMessage(LoggedInUser, Recepient, Message)) {
context.Response.AddHeader("CustomHeaderJSON", "ResponseStatus:'RS-OK'");
} else {
context.Response.AddHeader("CustomHeaderJSON", "ResponseStatus:'RS-Failed'");
}
}
服务器通过HTTP头部发送带有新添加的成功/失败指示器的响应。
在AJAX请求完成后，执行Handler函数。所有来自服务器的响应都在handler函数中可用。在这种情况下，指定的handler函数是ProcessSendMessageResponse，以下是其定义：
function ProcessSendMessageResponse() {
var ResponseStatus = GetHeader(ResponseHeaderJSON, 'ResponseStatus');
if (ResponseStatus == "RS-OK") {
// ...
}
}
如所见，'ResponseStatus'的值从响应HTTP头部中提取，这些头部在函数中是现成可用的。因为'ResponseHeaderJSON'是一个JSON字符串，所以使用GetHeader函数来提取JSON字符串中的特定值。然后检查'ResponseStatus'的值以通知发送消息的成功/失败。