Two ways to solve unnecessary refresh using Ajax

Below I will bring you two methods of Ajax to solve redundant refreshes. Let me share it with you now and give it as a reference for everyone.

The controller Servlet provides simple changes:

For Ajax systems, the server response does not need to be the entire page content, it can just be

Required data, the controller cannot forward the data request to the jsp page.

The controller has two options at this time:

1. Directly generate simple response data.

In this mode, the Servlet directly obtains the page output stream through response and generates a character response through the

output stream.

package pers.zkr.chat.web;

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

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 pers.zkr.chat.service.ChatService;


@WebServlet(urlPatterns={"/chat.do"})
public class ChatServlet extends HttpServlet {

 @Override
 public void service(HttpServletRequest request, HttpServletResponse response)
  throws ServletException, IOException {
 // TODO Auto-generated method stub
 
 request.setCharacterEncoding("utf-8");
 
 
 String msg=request.getParameter("chatMsg");
 System.out.println(msg);
 
 if(msg!=null&&!msg.equals("")){
  String user=(String)request.getSession().getAttribute("user");
  System.out.println(user+"user");
  ChatService.instance().addMsg(user, msg);
  
 }
 
 //设置响应内容的类型
 response.setContentType("text/html;charset=utf-8");
 // 获取页面输出流
 PrintWriter out = response.getWriter();
 //直接生成响应
 out.println(ChatService.instance().getMsg());
 
 request.setAttribute("msg",ChatService.instance().getMsg());
 
 forward("/chat.jsp", request , response);
 }

 private void forward(String url, HttpServletRequest request,
  HttpServletResponse response) throws ServletException, IOException {
 // TODO Auto-generated method stub
 
 request.getRequestDispatcher(url)
   .forward(request , response);  
 }
 
}

2. Turn to a simple jsp and use the JSP page to generate a simple response.

The controller forwards the request to another JSP page, and the JSP page is only responsible for outputting chat information

Here you need a jsp page to receive the information sent by the controller The data is also the server's response text, and on the

original page, just:

1) Create an XMLHttpRequest object

2) Send a request

3) Receive the server’s response

package org.crazyit.chat.web;

import javax.servlet.*;
import javax.servlet.http.*;
import javax.servlet.annotation.*;

import java.io.*;

import org.crazyit.chat.service.*;

/**
 * Description:
 * 
网站: 脚本之家
 * 
Copyright (C), 2001-2014, Yeeku.H.Lee
 * 
This program is protected by copyright laws.
 * 
Program Name:
 * 
Date:
 * @version 1.0
 */
@WebServlet(urlPatterns={"/chat.do"})
public class ChatServlet extends HttpServlet
{
 public void service(HttpServletRequest request,
 HttpServletResponse response)throws IOException,ServletException
 {
 // 设置使用GBK字符集来解析请求参数
 request.setCharacterEncoding("utf-8");
 String msg = request.getParameter("chatMsg");
 if ( msg != null && !msg.equals(""))
 {
  // 取得当前用户
  String user = (String)request.getSession(true)
  .getAttribute("user");
  // 调用ChatService的addMsg来添加聊天消息
  ChatService.instance().addMsg(user , msg);
 }
 // 将全部聊天信息设置成request属性
 request.setAttribute("chatList" ,
  ChatService.instance().getMsg());
 // 转发到chatreply.jsp页面
 forward("/chatreply.jsp" , request , response);
 }
 // 执行转发请求的方法
 private void forward(String url , HttpServletRequest request,
 HttpServletResponse response)throws ServletException,IOException
 {
 // 执行转发
 request.getRequestDispatcher(url)
  .forward(request,response);
 }
}

Page to receive data

<%@ page contentType="text/html;charset=GBK" errorPage="error.jsp"%>
<%-- 输出当前的聊天信息 --%>
${requestScope.chatList}

html page

 
 
 




聊天页面




 
 

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Related articles:

Implement ajax drag-and-drop file upload (with code)

jquery ajax to implement file upload function (with code) Code)

Method to dynamically load line charts through Ajax (graphic tutorial)

The above is the detailed content of Two ways to solve unnecessary refresh using Ajax. For more information, please follow other related articles on the PHP Chinese website!