三、原生JS发送Ajax请求

一、Ajax实现步骤

使用Ajax技术实现异步交互：

• 创建XMLHttpRequest对象（根据浏览器的不同创建方式可能不同，特别是低版本的IE浏览器）
• 创建一个回调函数（可以简单理解为回来的时候再调用的函数，callback）
• 通过XMLHttpRequest对象设置请求信息（方式和路径，open操作）
• 向服务器发送请求（send操作）
• 创建回调函数，根据响应状态动态更新页面
• 编写服务器端处理客户端请求

二、原生请求

示例代码：
hello.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>


















    

Servlet代码：

package com.itheima.ajax;

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

/**
 * 入门
 */
public class Ajax1Servlet extends HttpServlet {
    private static final long serialVersionUID = 1L;

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        System.out.println("请求来了~~");
        response.getWriter().print("success~~");
    }

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

}

web配置信息：

  
  
    This is the description of my J2EE component
    This is the display name of my J2EE component
    Ajax1Servlet
    Ajax1Servlet
  

  
    Ajax1Servlet
    /ajax1
      
  
    index.jsp
  

三、get方式

jsp代码：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>



  
    
    
    
    
    
    
        
    
    
    

  
  
  
    
  
  

servlet代码：

import java.io.IOException;
import java.io.PrintWriter;

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


public class ajax2 extends HttpServlet {

    
    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        // 接受参数
        String username = request.getParameter("username");
        username = new String(username.getBytes("iso8859-1"),"utf-8") ;
        System.out.println(username);
        // 响应数据
        response.setContentType("text/html;charset=utf-8");
        response.getWriter().println("姓名：" + username);
    }

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

    }

}

web代码：

  
  
    This is the description of my J2EE component
    This is the display name of my J2EE component
    Ajax1Servlet
    Ajax1Servlet
  
  
    This is the description of my J2EE component
    This is the display name of my J2EE component
    ajax2
    ajax2
  


  
    Ajax1Servlet
    /ajax1
  
  
    ajax2
    /ajax2
      
  
    index.jsp
  

四、post方式

jsp代码：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>



  
    
    
    
    
    
    
        
    
    
    

  
  
  
    
  
  
  

servlet代码：

import java.io.IOException;
import java.io.PrintWriter;

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


public class ajax2 extends HttpServlet {

    
    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        // 接受参数
        String username = request.getParameter("username");
        username = new String(username.getBytes("iso8859-1"),"utf-8") ;
        System.out.println(username);
        // 响应数据
        response.setContentType("text/html;charset=utf-8");
        response.getWriter().println("姓名：" + username);
    }

    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        this.doGet(request, response);
    }

}

注：这个地方在使用post发送请求的时候，可以通过url传递数据，但是要是不使用url而使用send的方式传递数据的话，必须首先设置表头，否则拿不到数据。这个地方可能就是我之前的那个bug的原因了。