第一次接触Jetty感觉还不错，小而简单速度也较快。对于纯java开发的开源web服务器来说确实值得推荐。
今天在http://jetty.mortbay.org/上下载了Jetty 6版本，解压后无需安装就可以运行了（双击bin目录下的Jetty-Service.exe）。只得注意的是jettty也是使用的8080端口，所以机器上同时配置tomcat的朋友可以修改一下jetty的默认端口。（contrib目录就是jetty的配置文件的所在位置，打开jetty.xml找到<Set
name="port"><SystemProperty name="jetty.port" default="8080"/></Set>修改成8090就可以了）
初次，使用jetty当然要看看jetty自带example。在webapps目录下有一个test文件夹，里面包含了几个request,session,cookies,jsp的例子。其中我比较感兴趣的应该是Jetty AJAX Chat这个小例子。简单的几个文件就完成了一个在线chat，适合移植到任意的web系统当中，所以纪录一下方便以后使用。
1.chat.html(主要的部分是chatroom的div,引用的时候直接把这段copy出来就好了)
<html>
<head>
<title>Jetty chat</title>
<script type="text/javascript" src="../concat?/js/behaviour.js&/js/ajax.js&/chat/chat.js"></script>
<link rel="stylesheet" type="text/css" href="chat.css"></link>
</head>
<body onunload="room.leave()">
<h1>Jetty AJAX Chat</h1>
Three really important things about this chat room demo:<ul>
<li>It has really HORRID Styling. Please feel free to donate a pretty css :-)</li>
<li>It is written using js techniques provided by
<a href="http://bennolan.com/behaviour/">Behaviour</a> and
<li>It uses Jetty6 <a href="/javadoc/org/mortbay/util/ajax/Continuation.html">Continuations</a>. No threads
are used when waiting for async events (see below).
</li>
</ul>
<div id="chatroom">
<div id="chat"></div><div id="members"></div>
<div id="input">
<div id="join" >
Username: <input id="username" type="text"/><input id="joinB" class="button" type="submit" name="join" value="Join"/>
</div>
<div id="joined" class="hidden">
Chat: <input id="phrase" type="text"></input>
<input id="sendB" class="button" type="submit" name="join" value="Send"/>
<input id="leaveB" class="button" type="submit" name="join" value="Leave"/>
</div>
</div>
</div>
</body>
</html>
chat.html引用了三个js（ajax.js和beheaviour.js是jetty自带的JS是ajax的实现部分）
- ajax.js
- behaviour.js
- chat.js（聊天功能的是要实现部分）
2.chat.js
function $() {
return document.getElementById(arguments[0]);
}
function $F() {
return document.getElementById(arguments[0]).value;
}
var room =
{
_last: "",
_username: null,
join: function(name)
{
if (name == null || name.length==0 )
{
alert('Please enter a username!');
}
else
{
this._username=name;
$('join').className='hidden';
$('joined').className='';
$('phrase').focus();
Behaviour.apply();
ajax.sendMessage('join', room._username);
}
},
leave: function()
{
// switch the input form
$('join').className='';
$('joined').className='hidden';
$('username').focus();
Behaviour.apply();
ajax.sendMessage('leave',room._username);
room._username=null;
},
chat: function(text)
{
if (text != null && text.length>0 )
{
ajax.sendMessage('chat',text);
}
},
_chat: function(message)
{
var divChat=document.getElementById("chat");
var from=message.getAttribute('from');
var special=message.getAttribute('alert');
var text=message.childNodes[0].data;
if ( special!='true' && from == room._last )
from="...";
else
{
room._last=from;
from+=":";
}
var parentElement = divChat;
if (special=='true')
{
var span = document.createElement("span");
span.className="alert";
divChat.appendChild(span);
parentElement=span;
}
var spanFrom = document.createElement("span");
spanFrom.className="from";
spanFrom.innerHTML=from+" ";
var spanText = document.createElement("span");
spanText.className="text";
spanText.innerHTML=text;
var lineBreak = document.createElement("br");
parentElement.appendChild(spanFrom);
parentElement.appendChild(spanText);
divChat.appendChild(lineBreak);
divChat.scrollTop = divChat.scrollHeight - divChat.clientHeight;
},
_members: function(message)
{
try
{
var divMembers = document.getElementById("members");
divMembers.innerHTML="";
var spanMember = document.createElement("span");
var ul = document.createElement("ul");
spanMember.appendChild(ul);
var x = message.getElementsByTagName("li");
for (var i=0;i<x.length;i++)
//以列表形式循环输出div message的叶子节点
{
var li = document.createElement("li");
li.innerHTML = x[i].firstChild.nodeValue;
ul.appendChild(li);
}
divMembers.appendChild(spanMember);
}
catch(e)
{
window.status="ERROR: members "+e.name + ": " + e.message;
// alert("_members " + e);
}
}
};
ajax.addListener('chat',room._chat);
ajax.addListener('members',room._members);
ajax.addPollHandler(room._poll);
var chatBehaviours =
{
'#username' : function(element)
{
element.setAttribute("autocomplete","OFF");
element.onkeyup = function(ev)
{
var keyc=EvUtil.getKeyCode(ev);
if (keyc==13 || keyc==10)
{
room.join($F('username'));
return false;
}
return true;
}
},
'#joinB' : function(element)
{
element.onclick = function(event)
{
room.join($F('username'));
return false;
}
},
'#phrase' : function(element)
{
element.setAttribute("autocomplete","OFF");
element.onkeyup = function(ev)
{
var keyc=EvUtil.getKeyCode(ev);
if (keyc==13 || keyc==10)
{
room.chat($F('phrase'));
$('phrase').value='';
return false;
}
return true;
}
},
'#sendB' : function(element)
{
element.onclick = function(event)
{
room.chat($F('phrase'));
$('phrase').value='';
return false;
}
},
'#leaveB' : function(element)
{
element.onclick = function()
{
room.leave();
return false;
}
}
};
Behaviour.register(chatBehaviours);
3.chat.css(在线聊天的样式控制)
div
{
border: 0px solid black;
}
div#chatroom
{
width: 41em;
background-color: #e0e0e0;
border: 1px solid black;
}
div#chat
{
float: left;
width: 30em;
height: 20ex;
overflow: auto;
background-color: #f0f0f0;
padding: 4px;
border-right: 1px solid black;
}
div#members
{
float: left;
clear: right;
width: 10em;
border: 0px solid black;
}
div#input
{
clear: both;
padding: 4px;
border-top: 1px solid black;
}
input#phrase
{
width:28em;
background-color: #e0f0f0;
}
input#username
{
width:14em;
background-color: #e0f0f0;
}
div.hidden
{
display: none;
}
span.from
{
font-weight: bold;
}
span.alert
{
font-style: italic;
}
实现结果预览:
