`
269629151
  • 浏览: 121822 次
社区版块
存档分类
最新评论

ajax长连接简单模拟

    博客分类:
  • ajax
阅读更多

http://www.cnblogs.com/lexus/archive/2011/11/15/2249480.htm

 

ajax长连接介绍

 

 

简单模拟 (jsp + Jquery ajax + struts2)

 

页面:

 

index.jsp

 

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>


<title>Index</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<script type="text/javascript" src="/js/jquery182.js" ></script>
<script type="text/javascript">
//定时发送消息
var timer = null ;
//当前消息数
var num = 0 ;
//连接数
var connects = 0 ;
$(document).ready(function(){
document.onkeydown = function(e){
if(!e)
e = window.event ;
if(e.keyCode == 13 ){
send() ;
}
};

});
//发送信息
function send(){
var user = $("#user").val() ;
var message = $("#message").val() ;
$(".send_note_div").append("<p>sendmessage" + num + " start...</p>");
$.post("longAjax!save.action",{"user" : user , "num" : num , "message" : message},function(data){
if(data){
var json = data ;
num = json.num ? json.num : 0 ;
}else{
$(".message_div").append("<p>"+ "信息发送错误" + "</p>");

}
});
}
function load(){
//发起连接,连接数加1
connects ++ ;
//始终保持一个连接

if(connects > 1){
connects = 1 ;
return ;
}
var user = $("#user").val() ;
$(".load_note_div").append("<p>loadmessage" + num + " start...</p>");
$.ajax(
{
url:"longAjax!load.action",
type:"POST",
dataType:"json",
data : {"user" : user , "num" : num ,"action" : "list"},
timeout:60000, //超时时间,设置为60s.
success:function(data){
var json = data ;
if(data){
num = json.num ? json.num : 0 ;
$(".load_note_div").append("<p>loadmessage" + num + " end...</p><br/>");
$(".message_div").append(json.returnValue);
//当连接关闭、连接数减1
connects -- ;
//如果连接数少于1 则发起新的连接

if(connects == 0){
load() ;
}
}
},
error : function(){
$(".load_note_div").append("<p>loaderror" + num + " end...</p><br/>");
}
});
}
timer = setInterval(load,20000);
function clear_(){
$(".message_div").text("");
}
</script>
<style type="text/css">
.body_div{
text-align: center;
height: 800px ;
widows: 600px ;
}
.message_div{
height: 300px ;
width: 600px ;
background : #ffa0c1 ;
overflow: auto;
border: 1 px;
text-align: left;
padding-left: 10 px;
}
.load_note_div{
height: 300px ;
width: 200px ;
overflow: auto;
border: 1 px;
text-align: left;
padding-left: 10 px;
}
.send_note_div{
height: 300px ;
width: 200px ;
overflow: auto;
border: 1 px;
text-align: left;
padding-left: 10 px;
}
.send_note_div, .message_div, .load_note_div{
display: inline;
}
</style>
</head>

<body onload="load()">
<div class="body_div">
<div style="display: inline-block;">
<div class="load_note_div"></div>
<div class="message_div">
</div>
<div class="send_note_div"></div>
</div>
<div class="input_div">
<form action="message.jsp" method="post">
<input type="hidden" name="number" id="number" value="" />
<p><span>User:</span> <span> <input type="text" name="user" id = "user" value="" /> </span> </p>
<p><textarea rows="5" cols="60" name="message" id="message" ></textarea></p>
<p><button onclick="send()" >发送</button><button onclick="clear_()" >清空信息</button></p>
</form>
</div>
</div>
</body>
</html>

 

action :

 

 

package action;
import java.text.SimpleDateFormat;
import java.util.Date;

 

public class LongAjaxConnectAction{
//request 对象

//消息总数量
private static int number = 0;
//消息数组
private static String []messages = new String [10000] ;
private String user ; // 用户
private String message ; // 消息
private Integer num ; // 当前用户已有消息数
private String returnValue ;
public String save() throws Exception{
Date t = new Date() ;
SimpleDateFormat df = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
String ms = "<font color=\"blue\">" + user + "</font> : " + message +" " + df.format(t) ;
messages[number ++] = ms ;
return "save" ;
}
public String load() throws Exception{
boolean isWaitting = returnMsg() ;
if(isWaitting){
waitting() ;
}
this.num = number ;
return "load";
}
/**
*判断是否有新消息,并返回新消息,防止同时保存消息与获取消息
**/
public synchronized boolean returnMsg(){
returnValue = null ;
if(num < number){
returnValue = "" ;
for(int i = num ; i< number ; i++){
returnValue += "<p>[" + i +"]" + messages[i] + "</p>" ;
}
return false ;
}
return true ;
}
//保持连接等待新消息 或超时
public void waitting() throws Exception{
Thread t = new Thread(){
long time1 = System.currentTimeMillis() ;
public void run(){
while(true){
if(System.currentTimeMillis() - time1 > 30000){ //连接超时
break ;
}
try{
Thread.sleep(100) ;
}catch(Exception e){
}
if(num < number){ // 有信息
break ;
}
}
}
} ;
t.start() ;
t.join() ; // 保证当线程t执行完后在执行后续任务
returnMsg() ;
}

public String getUser() {
return user;
}
public void setUser(String user) {
this.user = user;
}
public String getMessage() {
return message;
}
public void setMessage(String message) {
this.message = message;
}
public Integer getNum() {
return num;
}
public void setNum(Integer num) {
this.num = num;
}
public String getReturnValue() {
return returnValue;
}
public void setReturnValue(String returnValue) {
this.returnValue = returnValue;
}

}

 

分享到:
评论

相关推荐

    web即时聊天(ajax长轮询方式实现)

    在长轮询中,客户端发送一个Ajax请求到服务器,服务器保持这个连接打开,直到有新的消息时才返回,或者在超时后关闭连接,客户端收到响应后立即再次发起新的请求,形成一个持续的循环。 【Ajax技术】 Ajax的核心...

    使用ajax模拟用户名是否被占用

    "使用Ajax模拟用户名是否被占用"这个话题正是为了提升这种体验而设计的。Ajax(Asynchronous JavaScript and XML)技术允许我们在不刷新整个页面的情况下,与服务器进行异步数据交换,这样用户在输入用户名时就能...

    简单AJAX与ASP.NET聊天室

    【简单AJAX与ASP.NET聊天室】是一种利用Ajax技术与ASP.NET框架构建的实时交互式应用程序,主要用于模拟在线聊天环境。Ajax(Asynchronous JavaScript and XML)的核心在于通过JavaScript异步地与服务器进行数据交换...

    AjaxRequest 离线包

    离线包可能提供了一个简单的Mock Server,允许开发者预定义响应数据和状态码,以便在本地测试Ajax请求。 6. **示例代码和教程**:为了帮助开发者快速上手,离线包可能包含一些示例代码和使用教程,演示如何发起Ajax...

    基于ajax的即时通讯系统例子

    2. WebSocket:尽管AJAX可用于实现简单的即时通讯,但为了提供更高效、低延迟的双向通信,WebSocket协议是一个更好的选择。WebSocket创建一个持久的连接,允许数据双向流动,减少了HTTP的开销。 3. Long Polling:...

    JavaWeb ajax异步自动填充信息

    本示例“JavaWeb ajax异步自动填充信息”是一个典型的Ajax应用,模拟了搜索引擎如百度在用户输入时自动填充建议的功能。 首先,我们需要理解Ajax的工作原理。Ajax的核心是XMLHttpRequest对象,它允许JavaScript在...

    AJax,java即时通讯 web qq

    3. **长轮询与Comet技术**:在WebSocket之前,Ajax常通过长轮询或Comet技术来模拟实时通信,通过延长HTTP请求的生命周期来实现数据推送。 4. **前端框架与库**:在前端,可能使用了jQuery或其他Ajax库来简化异步请求...

    AJAX-.net 无刷新提交数据

    在这里,我们将模拟一个简单的数据验证和提交过程,无须刷新页面即可显示结果。 ```csharp protected void Button1_Click(object sender, EventArgs e) { string input = TextBox1.Text; // 进行数据验证或处理 ...

    ajax实现仿百度搜索提示(suggestion)

    // 假设我们有一个简单的数组模拟数据库 $data = ['apple', 'banana', 'cherry']; $matches = array_filter($data, function($item) use ($q) { return strpos($item, $q) === 0; }); echo json_encode($...

    headfirst Ajax 源代码

    - **简单Ajax请求**:展示如何发送GET请求获取数据并更新页面。 - **异步表单提交**:模拟传统表单提交,但使用Ajax实现无刷新更新。 - **XML与JSON数据交换**:演示如何处理服务器返回的XML或JSON数据。 - **AJAX与...

    Ajax验证用户名和密码

    - 压缩包中的`AjaxTest`可能包含了测试代码,可能包括模拟Ajax请求的单元测试或者前端交互测试。这部分内容用于验证Ajax验证功能是否按预期工作。 总的来说,“Ajax验证用户名和密码”项目展示了如何结合前端和...

    ajax+php技术的登陆实例

    // 这里通常是数据库连接和查询,但为了简单起见,我们直接模拟验证 if ($username === 'test' && $password === '123456') { $response = array('status' =&gt; 'success'); } else { $response = array('status' =&gt;...

    手写AJAX代码,实现Goog的搜效果

    下面是一个简单的手写AJAX代码示例,模拟Google搜索功能: ```javascript // 创建XMLHttpRequest实例 var xhr = new XMLHttpRequest(); // 监听状态变化 xhr.onreadystatechange = function() { if (xhr....

    一个简单的ajax输入提示

    在这个案例中,我们探讨的是一个基于Ajax实现的简单输入提示功能,它模拟了类似Google搜索框的动态建议效果。用户在输入框中输入字符时,系统将实时显示以该字符开头的所有预设值,提供用户选择。 **基本原理** 这...

    Ajax开源代码免费下载

    在提供的"Ajax"压缩包中,包含了"ajax.dll"程序源码,这可能是一个JavaScript库或者一个模拟XMLHttpRequest的对象,供开发者在项目中使用。使用这个源码前,建议先了解其API和功能,以便更好地集成到你的项目中。 ...

    ajax校验

    // 假设这里是一个简单的模拟,实际应用中应连接数据库进行检查 boolean isExist = checkIfUsernameExist(username); if (isExist) { return "用户名已存在"; } else { return "用户名可用"; } } // 模拟...

    ajax实现登陆demo

    `Authenticate`方法模拟了验证过程,实际项目中应连接到数据库或其他身份验证服务进行验证。 4. **安全考虑** 虽然这个简单的Demo展示了Ajax登录的基本流程,但实际应用中还需要考虑更多安全问题,如: - 数据...

    Comet:基于_HTTP_长连接的“服务器推”技术

    这种方式模拟了持续的连接状态。 - 优点:易于实现,兼容性好,几乎所有现代浏览器都支持。 - 缺点:服务器端负载增加,特别是在高并发环境下,频繁的连接维护会带来额外的资源消耗。 2. **基于iframe及htmlfile...

    ajax使用,实现百度搜索范例

    在本教程中,我们将以一个简单的“百度搜索”范例来讲解Ajax的基本用法和实现过程。 ### 一、Ajax基础 1. **XMLHttpRequest对象**: Ajax的核心是JavaScript的XMLHttpRequest对象,它允许我们在后台与服务器通信,...

Global site tag (gtag.js) - Google Analytics