Ajax快速引入（表单get、post请求发送处理）

最新推荐文章于 2024-01-29 17:41:50 发布

hestyle

最新推荐文章于 2024-01-29 17:41:50 发布

阅读量1.4k

点赞数

分类专栏： # Jsp Ajax

本文链接：https://blog.csdn.net/qq_41855420/article/details/102300889

版权

本文档简要介绍了Ajax的基本概念，并通过实例详细讲解了如何使用Ajax进行网站登录表单的GET和POST请求处理。内容涵盖XMLHttpRequest对象的open和send方法，以及响应状态的检查。适合初学者快速上手。

摘要由CSDN通过智能技术生成

1.1 ajax简介

AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。
AJAX = 异步 JavaScript 和 XML。
AJAX 是一种用于创建快速动态网页的技术。

通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。传统的网页（不使用 AJAX）如果需要更新内容，必需重载整个网页面。
有很多使用 AJAX 的应用程序案例：搜索引擎、新浪微博、Google 地图、开心网等等。

1.2 XMLHttpRequest

XMLHttpRequest对象
XMLHttpRequest 是 AJAX 的基础，所有现代浏览器均支持 XMLHttpRequest 对象（IE5 和 IE6 使用 ActiveXObject）。所有现代浏览器（IE7+、Firefox、Chrome、Safari 以及 Opera）均内建 XMLHttpRequest 对象。
XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

XMLHttpRequest使用流程

①创建XMLHttpRequest对象
②请求(同步或者异步请求)
③服务器响应

1.3 Request的open、send方法

open(method, url, async)
method为请求类型：get或者post
url：请求资源在服务器上的地址
async:true(异步)或false(同步)

注意：默认方法是异步的，也就是开子线程，同步方法已经被废弃，不能再用

1.4 ajax准备状态码

request.readyState 获取准备状态码
0: 请求未初始化 	
1: 服务器连接已建立	 
2: 请求已接收
3: 请求处理中		 
4: 请求已完成，且响应已就绪

1.5 http响应状态

request.status 获取请求响应状态
200: "OK" 	
404: 未找到页面
405:用来访问本页面的 HTTP 谓词不被允许（方法不被允许） ，也就是post不能请求get方法

2 网站登录表单处理实例

创建一个Dynamic Web项目
项目目录结构：
在这里插入图片描述
LoginServlet.java文件

package cn.hestyle.web.servlet;

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

/**
 * Servlet implementation class LoginServlet
 */
@WebServlet("/LoginServlet")
public class LoginServlet extends HttpServlet {
   
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
   
		request.setCharacterEncoding("utf-8");
		String userName = request.getParameter("userName");
		String password = request.getParameter("password");
		
		System.out.println(userName + "\t" + password);
		//方便演示，只判断一个账号信息
		if ("hestyle".equals(userName) && "123456".equals(password)) {
   
			response.getWriter().write("success");
		} else {
   
			response.getWriter().write("failure");
		}
	}

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