JAVAWeb's use of get and post in ajax

JAVAWeb's use of get and post in ajax

01. Introduction to using background and ajax

In the development of javaWeb, it is inevitable to encounter asynchronous requests. In order to change the local information of the website without affecting the entire page, bloggers only know how to use ajax. AJAX is a technique for exchanging data with a server to update part of a web page without reloading the entire page. It should be noted that this blog post is based on jQuery to operate ajax.

02. Some properties of ajax

The most used document by bloggers is to query this URL ( http://www.runoob.com/jquery/jquery-ref-ajax.html )
Personally, in development, the most used are post and get requests. For those who have done development, there is no need to explain the difference between them. The specific difference can be found in the blog post ( https://blog.csdn.net/qq_36030288/article/details/52755798 ).

03. Use Cases

03.1. Basic introduction

$.get()The method requests data from the server via an HTTP GET request.
Syntax: $.get(URL,callback);
Where: URL is a required parameter, which is the address of the submitted data, callback includes the function after the request is successful, and the corresponding optional return data.
$.post()The method submits data to the server via an HTTP POST request.
Syntax: $.post(URL,data,callback);
where: The required URL parameter specifies the URL you wish to request. The optional data parameter specifies the data to send with the request.
The optional callback parameter is the name of the function to be executed after the request is successful.

03.2. Code details

front end:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.11.3.min.js"></script>
<script>
$(function(){
    //执行第一个按钮
    $("#btn1").click(function(){
        //使用get方式发送请求
        $.get("${pageContext.request.contextPath }/ajax?para=test01&content=test02",function(data){
            $(data).each(function(){
                alert("数据："+this);
            });
        },"json");
    });
    //执行第二个按钮
    $("#btn2").click(function(){
            $.post("${pageContext.request.contextPath }/ajax",{
                //要发送的数据
                para:"test01",
                content:"test02"
            },
            //执行返回的数据
                function(data,status){
                alert("数据: \n" + data + "\n状态: " + status);
            },"json");
    });
});
</script>
</head>
<body>
<button id="btn1">发送一个 HTTP GET 请求并获取返回结果</button><br><br>
<button id="btn2">发送一个 HTTP Post 请求并获取返回结果</button>
</body>
</html>

rear end:

package cn.study.Servlet;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import net.sf.json.JSONArray;

/**
 * Servlet implementation class AjaxServlet
 */
public class AjaxServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;

    /**
     * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        String data01 = request.getParameter("para");
        String data02 = request.getParameter("content");
        System.out.println(data01+"--"+data02);
        List<String> list=new ArrayList<String>();
        list.add(data01);
        list.add(data02);
        list.add("success");
        //将list封装成json
        String listJson=JSONArray.fromObject(list).toString();

        //写回去
        response.setContentType("text/html;charset=utf-8");
        response.getWriter().println(listJson);
    }

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

}

03.3. Code running results

write picture description here

04. Summary

There are many ways to use ajax. For details, see w3cschool, etc., such as http://www.runoob.com/jquery/jquery-ajax-intro.html .
The source code of this test can be found in Baidu cloud network disk: link: https://pan.baidu.com/s/17BwbCRSolLL-osWcM27INg Password: 9rbv