AJAX open不接受Servlet

时间:2018-03-26 17:12:29

标签: javascript json ajax servlets

我目前正在使用AJAX制作一个小程序。我想将一个JSON字符串发送到Servlet,但它不起作用。在我的浏览器中,我收到错误" Uncaught TypeError:无法读取属性'打开'未定义"

我猜这意味着它无法在以下行中找到Servlet:

xmlHttp.open("POST", "../JSONServlet", true);

但是,我以前做过类似的节目,从来没有遇到过这个问题,所以我不知道该怎么做才能让它发挥作用。

我的html和js文件位于 Web Pages / ex06 中,而我的Servlet位于 Source Packages / servlets / JSONServlet 中,但我已经尝试将其移动到某处其他(即使我制作了类似的程序),但它没有帮助。

这是html和javascript:



var xmlHttp;
window.onload = initAjax();

function initAjax() {
  if (window.XMLHttpRequest) {      
    xmlhttp = new XMLHttpRequest();
  }
  else if (window.ActiveXObject) {     // IE6 or older
    try {
      xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    }
    catch (ex) {                        // noch ältere MS Produkte
        try {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        catch (ex) {
        }
    }
  }
}

function doJSON1() {
    
  var car = new Car("Mercedes", "SLK", 2012); // car erstellen
  var carAsJSON = JSON.stringify(car); // json-String machen
  alert("Car object as JSON:\n " + carAsJSON);
  
  xmlHttp.open("POST", "../JSONServlet", true); // here is the problem
  xmlHttp.onreadystatechange = handleObjectRequest;
  xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  xmlHttp.send(carAsJSON); // json-String senden
  
}

function handleObjectRequest() {
  if (xmlHttp.readyState == 4) {
    if (xmlHttp.status == 200) {
        
      jsontext = xmlHttp.responseText;
      alert(jsontext);
      var benz = JSON.parse(jsontext);
      var output = benz.brand + " " + benz.model;
      document.getElementById("serverResponse").innerHTML = output;
 
    }else{
        alert("nope");
    }
  }else{
      alert("...");
  }
  alert("state change");
}

function Car(brand, model, year, color) {
  this.brand = brand;
  this.model = model;
  this.year = year;
  this.color = color;
}

<input type="button" value="JSON-Object senden&empfangen" onclick="doJSON1();"/>
&#13;
&#13;
&#13;

这是我的Servlet中的方法:

    protected void processRequest(HttpServletRequest request, HttpServletResponse response)
        throws ServletException, IOException {

    response.setContentType("text/html;charset=UTF-8");
    PrintWriter out = response.getWriter();

    InputStreamReader isr = new InputStreamReader(request.getInputStream());
    try {

        Gson gson = new Gson();

        // auto aus request erstellen
        Car car = gson.fromJson(isr, Car.class);

        // anderes auto schreiben
        Car car2 = new Car("audi", "tt", 2014);
        gson.toJson(car2, out);

    } catch (JsonSyntaxException e) {

        Gson gson = new Gson();
        String[] winter = gson.fromJson(isr, String[].class);
        String[] summer = {"Jun", "Jul", "Aug"};
        out.println(gson.toJson(summer));

    }

    out.flush();
    out.close();

}

My Car类是一个带有getter和setter的简单数据类,一个默认构造函数,一个自定义构造函数和一个toString。

1 个答案:

答案 0 :(得分:1)

您需要拥有open()的实例才能使用var xmlHttp = new XMLHttpRequest(); 方法,因此请添加以下代码行:

xmlHttp.open("POST", "../JSONServlet", true);

在使用open()方法之前:

initAjax

编辑: - 在我做之前你也有@james指出的拼写错误,在你xmlhttp函数中你有一个变量xmlHttp因为你的全局变量是{{1}},两者都不相同。