Question

我在许多在线教程中看到了简单的Ajax源代码示例。我想知道的是，使用示例中的源代码是否完全正常？

还有什么要添加到真实世界应用程序的代码中吗？

为使应用程序更加健壮和安全，需要采取哪些步骤？

以下是我从网上获得的示例源代码：

function getChats() {
    xmlHttp=GetXmlHttpObject();
    if (xmlHttp==null) {
            return;
    } 
    var url="getchat.php?latest="+latest;   
    xmlHttp.onreadystatechange=stateChanged;
    xmlHttp.open("GET",url,true);
    xmlHttp.send(null);
} 

function GetXmlHttpObject() {
    var xmlHttp=null;
    try {
            xmlHttp=new XMLHttpRequest();
    } catch (e) {
            try {
                    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
    }
    return xmlHttp;
}

Answer 1

您发布的代码缺少一个重要因素：函数stateChanged。

如果您不太了解自己发布的代码，那么当对getchats.php的调用完成时，会调用函数“stateChanged”并且该函数将负责处理响应。由于您正在调用的脚本和函数本身以“获取”为前缀，因此我非常确定您的回复是您将要感兴趣的内容。

除此之外，还有很多方法可以改进您发布的代码。我猜它的工作原理是声明一个“xmlHttp”对象然后使其可用于每个函数（因为如果没有，则stateChanged函数无法获得响应）。这是好的，直到您在最后一个（或最后几个）尚未回复之前运行AJAX请求，在这种情况下，每次都会将对象引用覆盖到最新请求。

此外，任何值得盐的AJAX代码都提供了成功和失败（服务器错误，页面未找到等）案例的功能，以便可以将适当的消息传递给用户。

如果您只是想在您的网站上使用AJAX功能，那么我会指向jQuery或similar framework的方向。

但如果您真的想了解技术以及幕后发生的事情，我会继续做您正在做的事情并在您尝试自己构建一个小型轻量级AJAX课程时提出具体问题。我就是这样做的，尽管我今天使用的是jQuery框架..我仍然很高兴我知道它在幕后是如何工作的。

Answer 2

我会使用类似DOMAssistant的框架，它已经为您完成了艰苦的工作，并且会更加强大并且添加额外的有用功能。

除此之外，您的代码看起来就像它可以完成这项工作。

Answer 3

我诚实地建议使用Ajax可用的众多库中的一个。我自己使用prototype，而其他人则更喜欢jQuery。我喜欢原型，因为它非常小。 Prototype Ajax tutorial解释得很好。它还允许您轻松处理错误。

new Ajax.Request('/some_url',
  {
    method:'get',
    onSuccess: function(transport){
      var response = transport.responseText || "no response text";
      alert("Success! \n\n" + response);
    },
    onFailure: function(){ alert('Something went wrong...') }
  });

我的Ajax代码应该有多复杂？

3 个答案: