AJAX+Servlet实现客户端无刷新请求服务器实践

客户端请求时间和服务端处理时间不匹配问题 现象: 客户端日志,调一个接口耗时为2-3s 服务端日志,处理一个请求耗时只有100-200ms 问题: 这明显速度不匹配, 理论上差不了太多才对 分析原因: 可能是服务端处理不过来,虽然一个请求服务端处理的时间很短,但是客户端请求响应的时间主要是消耗在等待被处理上 目前客户端的进程数是25, 服务端的服务进程数是2. ... 阅读详情
最近需要做一个在网页中要不断检测服务器端数据程序,当然最简单的方法是在html页面头部加以下标签
<META http-equiv=V="REFRESH" content="5;URL=本页面url">
实现将网页设成每隔5秒钟将自身页面刷新一次;从而检测或加载服务器端数据.
但该方法有一个不雅的问题是,页面要不停地闪烁刷新,而且在每次刷新时都会发出windows点击链接的声音.如果时间久了,没有人能忍受的了吧.
  现在找到了AJAX(异步 JavaScript 和 XML)这个技术,他可以帮我们解决客户端无需提交页面即可发送对服务器的请求,这些均通过客户端javascript实现,以下为实现代码:
第一部分:
<body onload="checknew()">
页面加载时即开始调用脚本checknew.
第二部分:页面脚本
//页面声明对象
var http_request;
function checknew()
{
        http_request = false;
        //下面需要建立一个XMLHttpRequest对象,用它进行服务器请求,针对不同浏览器建立方法不同
        if (window.XMLHttpRequest)
        { // Mozilla, Safari,...
            http_request = new XMLHttpRequest();
            if (http_request.overrideMimeType)
            {
                http_request.overrideMimeType('text/xml');
            }
        }
        else if (window.ActiveXObject)
        { // IE
            try             {
                http_request = new ActiveXObject("Msxml2.XMLHTTP");
            }
            catch (e)
            {
                try
                {
                    http_request = new ActiveXObject("Microsoft.XMLHTTP");
                }
                catch (e) {}
            }
        }
       
        if (!http_request) {
            alert('出现错误,不能建立一个XMLHTTP实例!');
            return false;
        }
        //funccallback为请求返回后要调用的javascript方法
        http_request.onreadystatechange = funccallback;
        //该请求用get方式发送至url为/servlet/CheckServlet的Servlet,url可以带参数或数据方式同一般url传值,Servlet请看后面代码
        http_request.open('GET',url, true);
        http_request.send(null);
        //如果要使用HTTP POST方式,必须要对 XMLHttpRequest 对象设置一个 Content-Type 头,使用以下语句(url中也可包含参数):
       //http_request.open('POST',url, true);
       //http_request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
       //http_request.send("这里为传的参数");
       //每隔5秒循环一次服务器请求
        setTimeout('checknew()',5000);
}
    //请求返回后调用方法
    function funccallback()
    {
        //检测请求状态http_request.readyState有以下几种状态 0 (未初始化) 1 (正在装载) 2 (装载完毕) 3 (交互中) 4 (完成)
        if (http_request.readyState == 4)
        {
//XMLHttpRequest的status属性被测试用来确定请求是否成功完成。当处理简单的GET与POST请求,你可以认为只要不是200(OK)的状态就表示发生了错误。
            if (http_request.status == 200)
            {
                //http_request.responseText为服务器返回的文本内容,可自行做各种处理
                 alert(http_request.responseText);
            }
            else
            {
                alert('对不起,请求出现错误!');
            }
        }
    }
//第三部分 ,java Servlet的代码:
首先在web.xml中配置web Servlet,如下:
  <servlet>
    <servlet-name>CheckServlet</servlet-name>
    <servlet-class>com.view.CheckServlet</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>CheckServlet</servlet-name>
    <url-pattern>/servlet/CheckServlet</url-pattern>
  </servlet-mapping>
下面为Servlet实例:
package com.view;
//导入包略去,可在ide中自动导入(以下代码包含部分ide自动生成代码,可略去)
public class CheckServlet extends HttpServlet
{
 public void destroy()
 {
  super.destroy();
// Just puts "destroy" string in log
  // Put your code here

 }
 public void doGet(HttpServletRequest request, HttpServletResponse response)
   throws ServletException, IOException
 {
  //用get方式发送请求,因此在此处理,
  response.setContentType("text/xml");
  response.setHeader("Cache-Control", "no-cache");
  String ids="hello,China!";
  //将ids返回给客户端
  response.getWriter().write(ids);
 }
 public void doPost(HttpServletRequest request, HttpServletResponse response)
   throws ServletException, IOException
 {
  //如果用post方式请求,则在此处理
 }
 public void init() throws ServletException
 {
  // Put your code here
 }
 
//以上代码,均测试成功,相信朋友们一看就懂,错误之处,敬请指教!
//全文完
Ajax与Servlet实现网页局部刷新与实时聊天功能 Servlet技术是Java EE的一个核心组件,主要用于处理客户端请求并生成响应。在Web应用中,Servlet相当于一个中间件,它介于HTTP协议与应用程序的业务逻辑之间。当客户端(比如浏览器)向服务器发送请求时,Servlet容器(例如Tomcat)负责接收请求,根据请求的URL定位到对应的Servlet,并将请求转发给Servlet处理。处理完成后,Servlet生成响应返回给客户端。 阅读详情

相关推荐

Servlet与jQuery AJAX结合JSON实现动态Web交互

本文还有配套的精品资源,点击获取 简介:Servlet、jQuery AJAX以及JSON技术是构建交互式网页应用的关键。本实例介绍了如何结合使用这些技术实现异步数据传输和改善用户体验。Servlet用于处理HTTP请求和业务逻辑,jQuery AJAX简化了AJAX操作,而JSON作为数据交换格式,使得前后端通信更为高效。通过实例学习,开发者可以掌握现代Web开发的核心技...

weixin_35705784的博客 1006

客户端同步数据至服务器出问题

  前段时间遇到一个问题,多台客户端向服务器同步数据时会出现id重复的错误,想来想去都无从下手。好不容易想了个蠢办法,一个个客户端与服务器单独配置过之后再一起连接就可以解决这个问题。这个问题今天又出现了,错误信息显示的是客户端2写入的数据出现id重复。没办法,把重复的id这一条文档删掉还是不能解决。然后又试了之前的老办法单独连接服务器,居然不行了!!!这是什么毛病?!! 实在没法子了,只...

weixin_30617797的博客 219

Ajax与Servlet构建实时智能提示框

Ajax(Asynchronous JavaScript and XML)技术通过在后台与服务器进行少量数据交换,实现了无需重新加载整个网页即可更新部分网页内容的功能。自2005年被Google在其产品中广泛应用后,它迅速成为Web开发中的重要技术之一。Servlet是一种运行在服务器端的小型Java程序,它用于处理客户端的请求并生成响应。Servlet是Java EE(Java Platform, Enterprise Edition)的核心组件之一,它在Web应用中扮演着控制器的角色。

weixin_31860973的博客 934

服务器收到请求无响应,为什么得到Http请求和响应太晚了

Havenard..5TCP/IP流将控制您担心的大部分内容."发送请求的速度比服务器无法处理"不,你永远不会比使用TCP会话时更快地向服务器发送任何内容.传输流被引导并且不可能比服务器可以处理的更快地发送."什么是网络缓冲区"TCP/IP通信中包含两个队列缓冲区,一个发送缓冲区和一个接收缓冲区.当你进行一次send()调用时,它并没有真正发送任何东西,它只是将数据排入发送缓冲区,并将返回给你,你...

weixin_35589827的博客 1928

AJAX+servlet实例入门

AJAX+servlet实例入门,简单易学,5分钟搞定AJAX

kettle连接达梦资源库数据库插件

kettle自定义插件plugin database plugin 达梦插件 dm插件

weixin_42122126的博客 2171

客户端和服务器端进行请求-响应的常用方法

开发工具与关键技术:VS/MVC 作者:何桂朋 撰写时间:2019年4月22日 客户端和服务器端进行请求-响应的原生js写法:XMLHttpRequest, 正如W3School 所说 XMLHttpRequest 对象提供了对 HTTP 协议的完全的访问,包括做出 POST 和 HEAD 请求以及普通的 GET 请求的能力。XMLHttpRequest 可以同步或异步地返回 Web 服务器的响应...

weixin_44550157的博客 6948

工业质检实战:用海康VisionMaster的BLOB分析搞定PCB焊点缺陷检测

本文详细介绍了如何利用海康VisionMaster平台的BLOB分析技术,构建一套针对PCB焊点缺陷的自动化视觉检测方案。文章从核心原理出发,重点阐述了如何通过动态阈值分割和模板匹配定位,克服工业现场光照不均、位置偏移等挑战,实现虚焊、漏焊等缺陷的精准、稳定检测,并提供了实战调优与系统集成的关键思路。

weixin_29091105的博客 563

ajax+servlet简单实现,基础ajax

AJAX 简介AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。AJAX 不是新的编程语言,而是一种使用现有标准的新方法。AJAX 最大的优点是在不重新加载整个页面的情况下,可以与服务器交换数据并更新部分网页内容。AJAX 不需要任何浏览器插件,但需要用户允许JavaScript在浏览器上执行。AJAX是基于现有的Intern...

one_dayR的博客 1780

蓝牙HCI Dongle实战:从芯片选型到协议栈集成的完整指南

本文详细介绍了蓝牙HCI Dongle的实战应用,从芯片选型到协议栈集成的完整指南。通过对比CSR8510、nRF52840等主流芯片的性能和价格,提供选型建议和避坑技巧。同时,深入解析Zephyr协议栈移植和常见问题排查,帮助开发者高效完成蓝牙项目开发。

weixin_30786657的博客 322

手把手教你学simulink(16.2)--基于Simulink的高通滤波器(High-Pass Filter)项目

基于Simulink的高通滤波器(High-Pass Filter)项目的详细实例介绍。这个项目将重点放在高通滤波器的设计、实现和仿真上,帮助你理解和应用高通滤波器在信号处理中的作用。

MHD0815的博客 926

AJAX+Servlet实现客户端无刷新请求服务器实践 (转)

最近需要做一个在网页中要不断检测服务器端数据程序,当然最简单的方法是在html页面头部加以下标签实现将网页设成每隔5秒钟将自身页面刷新一次;从而检测或加载服务器端数据.但该方法有一个不雅的问题是,页面要不停地闪烁刷新,而且在每次刷新时都会发出windows点击链接的声音.如果时间久了,没有人能忍受的了吧.  现在找到了AJAX(异步 JavaScript 和 XML)这个技术,他可以帮我们解决客户端无需提交页面即可发送对服务器的请求,这些均通过客户端javascript实现,以下为实现代码:第一部分:页面加

aqxiebin的专栏 391

【PyGIS】ERA5降雨蒸散发数据预处理

ERA5-LAND降雨蒸散发数据预处理

```On Earth, Be Water, By Coding``` 3145

Ajax请求 Servlet接受Ajax请求 SSM框架接受Ajax请求

Ajax请求是什么? ajax是一种创建交互式网页应用的网页开发技术,全称Asynchronous JavaScript and XML,特点是异步请求,局部刷新 ajax的优势: 异步模式,提升了用户的体验。 优化了浏览器和服务器之间的传输,减少了不必要的数据往返,减少了带宽占用。 ajax在客户端运行,承担了一部分本来由服务器承担的工作,从而减少了大用户量的服务器负载。 Servlet怎么接受Ajax请求? @WebServlet("/*******") 在编写的Servlet上面加这个注解 里面写路径

NuanShuTT的博客 483

第42章:AI代码生成的质量标准——何时用AI、何时自己写

> - AI代码生成的质量分级标准:可用、稳定、安全、优雅 > - 一个决策矩阵:什么场景适合用AI,什么场景必须人工编写 > - 如何评估AI生成的代码质量(复杂度、可读性、安全性) > - 实战对比:同一需求下AI生成代码 vs 人工编写代码 > - 团队落地:将质量标准集成到Code Review和CI流程 > - 我如何将团队AI代码接受率从70%提升到90%

sfishfly的博客 161

Python爬虫实战:利用Playwright与异步技术高效抓取链家十万级二手房数据

在开始编写代码之前,我们首先需要为项目选择合适的技术栈。1. 传统方案:Requests + BeautifulSoup优点: 简单、轻量、学习成本低。直接发送HTTP请求获取HTML,然后解析。缺点: 对于大量由JavaScript动态渲染的内容无能为力。现代网站(包括链家)大量使用JS来加载数据和实现交互,简单的HTTP请求无法获取到完整的页面内容。此外,容易被基于IP或请求头特征的反爬机制拦截。2. 进阶方案:Selenium优点。

2201_76125261的博客 891

使用JSP、servlet和ajax实现无刷新获取验证码

实现效果如下图所示: 首先编写服务器端的代码,实现向客户端输出随机的验证码,具体代码如下: package com.wxq.servlet; import java.io.IOException; import java.io.PrintWriter; import java.util.Random; import javax.servlet.ServletException; imp

JavaQ 2787

天爱验证码wasm验证码逆向

本文分析了某网站采用WASM加密技术的情况,发现其加密方式主要针对data和轨迹信息,整体加密逻辑变化不大。通过反混淆技术可以还原代码,并确认加密过程分为两步:先对原始参数逐个加密,再调用WASM模块进行最终加密。研究发现关键参数drives和ki都存储在WASM模块内,通过提取wasm_exec.js文件即可直接使用该加密功能。本文仅提供技术研究思路,强调严禁用于任何违法行为。

码王吴彦祖的博客 936

JavaWeb-----Ajax异步请求 json对象 服务器如何返回json数据 使用ajax完成一个案例

ajax异步请求 json对象 服务器如何返回json数据 使用ajax完成一个案例

BUG专业户 2991

OV9734 DATASHEET,完整规格书

OV9734完整规格书,包括电气参数,尺寸规格,寄存器配置表等

温度PID控制PLC程序

温度PID稳定控制程序,适用于欧姆龙PLC,对其他PLC也具有很大参考价值

jquery ajax无刷新跳转,jQuery+Ajax实现无刷新操作

使用jQuery实现Ajax操作 想要实现Ajax页面无刷新效果,但是直接利用Ajax代码实在有些麻烦,所以就想用jQuery实现。jQuery很好的封装了Ajax的核心对象XMLHTTPRequest。所以用起来非常方便。首先,创建服务器端代码,这里用Servlet实现服务器端的数据处理;代码如下:protected void doPost(HttpServletRequest re...

weixin_30231327的博客 597

SAP B1中文培訓教材_SDK

公司内部培训资料,对开发工具 ,DIAPI, UIAPI,Add-ON有详细解说

jquery ajax 无刷新上传文件到servlet

删除文件的表单要加入如下enctype属性: enctype="multipart/form-data"> 要实现无刷新上传文件首先要阻止submit按钮提交表单,在submit按钮添加onclick属性: onclick="return false">登录 这样写这个提交按钮就失效了。 接着需要在按下提交按钮时执行ajax操作,将标签改为: return uplo

Japhics的博客 2100

android 蓝牙通讯demo

android 下蓝牙通讯demo,实现了发现蓝牙,使能蓝牙,通过蓝牙发送消息。

Ajax基本应用---自动刷新页面

本篇主要介绍了用Ajax实现自动刷新页面的实现步骤,以及一些问题的解释。

Stark_JC的博客 3245
上一篇: 在.net的页面与asp的也面中可以传递session
下一篇: AJAX基础教程
louisp
博客等级 码龄21年 5粉丝 44原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值