关于图表中的请求次数变动,每次刷新访问量会+2而不是+1

来源:2-4 实现动态图表

Ranron

2019-12-03 21:15:41

package com.imooc.total;

import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;

import javax.servlet.ServletContextEvent;
import javax.servlet.ServletContextListener;
import javax.servlet.ServletRequestEvent;
import javax.servlet.ServletRequestListener;

public class RequestTotalListener implements ServletContextListener,ServletRequestListener{

	@Override
	public void requestDestroyed(ServletRequestEvent arg0) {
		// TODO Auto-generated method stub
		
	}

	@Override
	public void requestInitialized(ServletRequestEvent arg0) {
		List<String> timeList=(List<String>) arg0.getServletContext().getAttribute("timeList");
		List<Integer> valueList=(List<Integer>)arg0.getServletContext().getAttribute("valueList");
		Date date = new Date();
	    SimpleDateFormat sdf = new SimpleDateFormat("HH:mm");
	    String time = sdf.format(date);
	    if(timeList.indexOf(time)==-1) {
	    	timeList.add(time);
	    	valueList.add(1);
	    	arg0.getServletContext().setAttribute("timeList", timeList);
	    	arg0.getServletContext().setAttribute("valueList", valueList);
	    }else {
	    	int a = timeList.indexOf(time);
	    	int value=valueList.get(a);
	    	valueList.set(a, value+1);
	    	arg0.getServletContext().setAttribute("valueList", valueList);
	    }
	    
	    
		
	}

	@Override
	public void contextDestroyed(ServletContextEvent arg0) {
		// TODO Auto-generated method stub
		
	}

	@Override
	public void contextInitialized(ServletContextEvent arg0) {
		List timeList = new ArrayList();
		List valueList = new ArrayList();
		arg0.getServletContext().setAttribute("timeList",timeList);
		arg0.getServletContext().setAttribute("valueList", valueList);
		
	}

}
package com.imooc.total;

import java.io.IOException;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import com.alibaba.fastjson.JSON;
import javax.servlet.ServletContext;
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 RequestTotalServlet
 */
@WebServlet("/rt")
public class RequestTotalServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public RequestTotalServlet() {
        super();
        // TODO Auto-generated constructor stub
    }

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		ServletContext context = request.getServletContext();
		List<String> timeList = (List<String>) context.getAttribute("timeList");
		List<Integer> valueList = (List<Integer>) context.getAttribute("valueList");
		response.setContentType("text/html;charset=utf-8");
		//response.getWriter().println(timeList.toString());
		//response.getWriter().println("<br/>");
		//response.getWriter().println(valueList.toString());
		Map map = new HashMap();
		map.put("timeList", timeList);
		map.put("valueList", valueList);
		String json=JSON.toJSONString(map);
		response.getWriter().println(json);
		System.out.println("收到请求");
	}

}

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

<script type="text/javascript" src="js/echarts.min.js"></script>

<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>

</head>

<body>

<div id="main" style="width: 600px;height:400px;"></div>



 <script type="text/javascript">

 $.ajax({

"url":"./rt",

"type":"get",

"dataType":"json",

"success" : function(json){

var myChart = echarts.init(document.getElementById('main'));


        // 指定图表的配置项和数据

        var option = {

            title: {

                text: '请求流量分析统计'

            },

            tooltip: {},

            legend: {

                data:['访问量']

            },

            xAxis: {

                data: json.timeList

            },

            yAxis: {},

            series: [{

                name: '访问量',

                type: 'line',

                data: json.valueList

            }]

        };


        // 使用刚指定的配置项和数据显示图表。

        myChart.setOption(option);

}

 

 })

 

 

 

        // 基于准备好的dom,初始化echarts实例

        

    </script>


</body>

</html>

写回答

2回答

好帮手慕酷酷

2019-12-04

同学你好,你的理解是正确的,这里ajax的请求也会被监听器所拦截到,所以访问量回家2,在本节的视频中16分钟左右。老师会讲到将ajax的请求的请求排出到请求范围外的方式。同学可以继续看一下视频的内容。

如果我的回答解决了你的疑惑,请采纳!祝学习愉快!

0

Ranron

提问者

2019-12-03

好像是因为页面本身的请求+ajax请求,所以一次+2.。

0

0 学习 · 9666 问题

查看课程