个人中心
gpt4 book ai didi

javascript - Http Get 请求中止先前的 Get 请求

转载 作者：行者123 更新时间：2023-12-03 11:45:15 27 4
gpt4 key购买 nike

我正在学习 Ajax、javascript 和 html，并且有一个应用程序可以触发“get”请求，然后再触发另一个“get”请求。这些请求是用户按下按钮的结果。在我的 servlet 中，我使用 TimeUnit.SECONDS.sleep(10); 模拟了正在冲泡的咖啡订单；

当发送第二个“get”请求时(在 10 秒过去之前)，第一个请求将被中止(在 Firefox 和 Chrome 中)。我已经进行了研究，但还没有找到足够的答案来解释原因。

有人可以解释一下吗？非常感谢。

这是我的 html...

    <html>
 <head>
  <title>Ajax-powered Coffee Maker</title>
  <link rel="stylesheet" type="text/css" href="coffee.css" />
  <script type="text/javascript" src="ajax.js"> </script>
  <script type="text/javascript" src="coffee.js"> </script>
  <script type="text/javascript" src="text-utils.js"> </script>
 </head>
 <body>
   <div id="header">
    <h1>Ajax-powered Coffee Maker</h1>
   </div>

  <div id="wrapper">
   <div id="coffeemaker1">
    <h2>Coffee Maker #1</h2>
    <p><img src="images/CoffeeMaker1.gif" alt="Coffee Maker #1" /></p>
    <div id="coffeemaker1-status">Idle</div>
   </div>

   <div id="coffeeorder">
    <p><img src="images/coffeeMugWithBeans.jpg" alt="Coffee Pot 1" /></p>
    <h2>Place your coffee order here:</h2>
    <div id="controls1">
     <form>
      <p>Name: <input type="text" name="name" id="name" /></p>
      <h3>Size</h3>
      <p> 
       <input type="radio" name="size" 
              value="small" checked>Small</input>
       &nbsp;&nbsp;
       <input type="radio" name="size" 
              value="medium">Medium</input>
       &nbsp;&nbsp;
       <input type="radio" name="size" 
              value="large">Large</input>
      </p>
      <h3>Beverage</h3>
      <p> 
       <input type="radio" name="beverage" 
              value="mocha" checked>Mocha</input>
       &nbsp;&nbsp;
       <input type="radio" name="beverage" 
              value="latte">Latte</input>
       &nbsp;&nbsp;
       <input type="radio" name="beverage" 
              value="cappucino">Cappucino</input>
      </p>
      <p>
       <input type="button"
              onClick="orderCoffee();"
              value="Order Coffee" />
      </p>
     </form>
    </div>
   </div>

   <div id="coffeemaker2">
    <h2>Coffee Maker #2</h2>
    <p><img src="images/CoffeeMaker2.gif" alt="Coffee Maker #2" /></p>
    <div id="coffeemaker2-status">Idle</div>
   </div>

   <p id="clear"></p>
  </div>
 </body>
</html>

我的 JavaScript...

    var request;
try {
    request = new XMLHttpRequest(); // Most browsers will do this
} catch (trymicrosoft) {
    try {
        request = new ActiveXObject("Msxm12.XMLHTTP"); // Internet Explorer
        // does this
    } catch (othermicrosoft) {
        try {
            request = new ActiveXObject("Microsoft.XMLHTTP"); // And this
            // sometimes
        } catch (failed) {
            request = null;
        }
    }
}
if (request == null) {
    alert("Error Creating Request Object!");
} else {
    alert("Request Object created!");
}


function getBeverage() {
    var beverageGroup = document.forms[0].beverage;
    for ( var i = 0; i < beverageGroup.length; i++) {
        if (beverageGroup[i].checked == true) {
            return beverageGroup[i].value;
        }
    }
}

function getSize() {
    var sizeGroup = document.forms[0].size;
    for ( var i = 0; i < sizeGroup.length; i++) {
        if (sizeGroup[i].checked == true) {
            return sizeGroup[i].value;
        }
    }
}

function serveDrink() {
    var reply = request.responseText;
    console.log("reply: " + reply);
}

function orderCoffee() {
    console.log("ordering coffee");
    var name = document.getElementById("name").value;
    var size = getSize();
    var beverage = getBeverage();
    var coffeemakerStatusDiv1 = document.getElementById("coffeemaker1-status");
    var status = getText(coffeemakerStatusDiv1);
    console.log("status1: " + status);
    if (status == "Idle") {
        replaceText(coffeemakerStatusDiv1, "Brewing " + name + "'s " + size + " " + beverage);
        document.forms[0].reset();
        var url = "coffee.do?name=" + escape(name) + "&size=" + escape(size)
                + "&beverage=" + escape(beverage) + "&coffeemaker=1";
        sendRequest(url);
    } else {
        var coffeemakerStatusDiv2 = document.getElementById("coffeemaker2-status");
        var status = getText(coffeemakerStatusDiv2);
        console.log("status2: " + status);
        if (status == "Idle") {
            replaceText(coffeemakerStatusDiv2, "Brewing " + name + "'s " + size + " " + beverage);
            document.forms[0].reset();
            var url = "coffee.do?name=" + escape(name) + "&size=" + escape(size)
                    + "&beverage=" + escape(beverage) + "&coffeemaker=2";
            sendRequest(url);
        } else {
            console.log("y am i here?");
        }
    }

}

function sendRequest(url) {
    request.onreadystatechange = serveDrink;
    request.open("get", url, true);
    request.send();
}

还有我的 servlet...

    package com.asponte.controller;

import java.io.IOException;
import java.util.concurrent.TimeUnit;
import java.util.logging.Logger;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.ibm.websphere.logging.WsLevel;

/**
 * Servlet implementation class CoffeeController
 */
@WebServlet("/CoffeeController")
public class CoffeeController extends HttpServlet {
    private static final long serialVersionUID = 1L;
    private Logger s_log = Logger.getLogger("com.asponte.controller");

    /**
     * @see HttpServlet#HttpServlet()
     */
    public CoffeeController() {
        super();
        // TODO Auto-generated constructor stub
    }

    /**
     * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
        boolean isDebug = false;

        if (s_log.isLoggable(WsLevel.ALL)) {
            isDebug = true;
        }
        if (isDebug) {
            s_log.entering("Coffee Servlet doGet()", "entering");
        }

        String name = request.getParameter("name");
        String size = request.getParameter("size");
        String beverage = request.getParameter("beverage");
        String maker = request.getParameter("coffeemaker");
        System.out.println("name: " + name);
        System.out.println("size: " + size);
        System.out.println("beverage: " + beverage);
        System.out.println("maker: " + maker);
        try {
            TimeUnit.SECONDS.sleep(10);
        } catch (InterruptedException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
        String toReturn;
        if (maker.equals("1")) {
            toReturn = "1";
        } else if (maker.equals("2")){
            toReturn = "2";
        } else {
            toReturn = "doggit";
        }
        response.getWriter().write(toReturn);
    }

    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
    }

}

最佳答案

也许这是因为您的服务器端配置，它仅使用一个线程来处理所有到达的请求。

关于javascript - Http Get 请求中止先前的 Get 请求，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26084672/

27 4 0
文章推荐： javascript - 使用字符集 windows-1251 处理请求时出错
文章推荐： javascript - 在文本字段中输入时显示预制建议列表
文章推荐： javascript - 将现有的移动 HTML 设计与 sencha touch 集成
文章推荐： javascript - jquery mobile listview 和可折叠集在返回时打开
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com