jQuery实现ajax页面异步请求时的错误

最新推荐文章于 2025-08-21 15:08:45 发布

原创最新推荐文章于 2025-08-21 15:08:45 发布 · 719 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

我爱BUG

本文探讨了HTTP 404 NotFound与500 InternalServerError错误的原因，主要涉及工程配置与servlet方法缺失问题。同时，通过分析jQuery源码中的XMLHttpRequest，解释了send()方法的错误处理。此外，文章还提供了使用原生JavaScript实现Ajax请求的详细步骤，包括创建XMLHttpRequest对象、设置请求参数、发送请求以及处理响应。

1. 404 (Not Found) :

2. 500 (Internal Server Error)

原因如下：

第一个错误是：工程路径、端口号或servlet程序名称出错。

第二个错误是：在servlet程序里面没有提供所要处理请求的方法。

我们看看这里的底层原因：

我们看一看对于上面的两个问题，发现都是在jQuery源码里面的XMLHttpRequest里面的send()方法报错
在这里插入图片描述
这里我们可以简单的看一看源文档里的说明：

这里大概说的就是当发起请求时， body参数提供请求主体（如果有），如果请求方法是GET或HEAD，则将忽略。如果未打开任何状态或设置了send（）标志，则抛出“ InvalidStateError” DOMException。

原生JavaScript实现Ajax请求

1、我们首先要创建 XMLHttpRequest 对象
2、调用 open 方法设置请求参数
3、调用 send 方法发送请求
4、在 send 方法前绑定 onreadystatechange 事件，处理请求完成后的操作。
1、创建一个 html 页面，发起请求

<!DOCTYPE html >
<html>
	<head>
	<title>Insert title here</title>
	<script type="text/javascript">
	function ajaxRequest() {
	// 1、我们首先要创建 XMLHttpRequest
	var xhr = new XMLHttpRequest();
	// 2、调用 open 方法设置请求参数
	xhr.open("GET","ajaxServlet?action=javaScriptAjax&a="+new Date(),true);
	// 4、在 send 方法前绑定 onreadystatechange 事件，处理请求完成后的操作。
	xhr.onreadystatechange = function() {
	// 判断请求完成，并且成功
	if (xhr.readyState == 4 && xhr.status == 200) {
	document.getElementById("div01").innerHTML = xhr.responseText;
	}
	}
	// 3、调用 send 方法发送请求
	xhr.send();
	}
	</script>
	</head>
	<body>
		<button onclick="ajaxRequest()">ajax request</button>
		<div id="div01">
		</div>
	</body>
</html>

2、创建一个 AjaxServlet 程序接收请求

public class AjaxServlet extends BaseServlet {
	private static final long serialVersionUID = 1L;
	protected void javaScriptAjax(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		System.out.println("ajax 请求过来了 a--" + request.getParameter("a"));
		Random random = new Random(System.currentTimeMillis());
		// 使用随机数，可以让客户端看到变化
		response.getWriter().write( new Gson().toJson(new GsonTest.Person(random.nextInt(100), "12312")));
	}
}

标签

#java #ajax #js #servlet