生活随笔
收集整理的這篇文章主要介紹了
Web版Telnet工具设计与实现
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
C/S架構(gòu)Telnet工具實(shí)現(xiàn)原理
C/S架構(gòu)的Telnet工具實(shí)現(xiàn)的主要思想是：界面組件捕獲鍵盤事件，經(jīng)過(guò)過(guò)濾、轉(zhuǎn)換將消息發(fā)送到服務(wù)端，服務(wù)通過(guò)Telnet第三方開(kāi)發(fā)包，將消息發(fā)送給Telnet服務(wù)端（多是支持Telnet的設(shè)備），然后將設(shè)備返回的信息返回到客戶端，客戶端進(jìn)行處理后顯示在界面。
Termlib組件
同樣在B/S中要實(shí)現(xiàn)Telnet/SSH功能，也需要實(shí)現(xiàn)類似C/S界面組件功能，這個(gè)組件不僅要過(guò)濾輸入字符，而且要根據(jù)Telnet協(xié)議要求實(shí)現(xiàn)了鍵盤輸入字符和發(fā)送字符命令之間的轉(zhuǎn)換以及設(shè)備返回內(nèi)容的處理(格式處理，字符替換)。
通過(guò)相關(guān)資料的搜索，發(fā)現(xiàn)網(wǎng)上有一個(gè)叫termlib的javascript組件（http://www.masswerk.at/termlib），這個(gè)js文件就是用javascript實(shí)現(xiàn)了一個(gè)命令行終端組件，雖然代碼僅僅幾千行，但是幾乎實(shí)現(xiàn)了命令行終端的所有功能，提供了相關(guān)的控制API。因此可以使用該組件來(lái)實(shí)現(xiàn)Web版的Telnet工具。
Termlib可以使用在命令終端、小游戲界面等相關(guān)的應(yīng)用場(chǎng)景，其中著名的PC機(jī)模擬項(xiàng)目——Javascript實(shí)現(xiàn)(http://www.bellard.org/jslinux/)模擬PC機(jī)，界面的實(shí)現(xiàn)過(guò)程也參考了termlib。termlib的最簡(jiǎn)單demo可以看termlib網(wǎng)站的demo和幫助。
?????? Termlib使用分幾種模式：默認(rèn)模式、字符模式、Raw模式、文件模式。默認(rèn)的是命令模式，是以回車鍵標(biāo)志命令事件，捕獲事件后回調(diào)使用者handler。其構(gòu)造函數(shù)可以定制term相關(guān)的參數(shù)。
???????分析網(wǎng)站中的demo發(fā)現(xiàn)，使用默認(rèn)模式來(lái)實(shí)現(xiàn)Web版本的Telnet是最好的辦法。但是還需要解決如下幾個(gè)關(guān)鍵問(wèn)題：
1、??從C/S的Telnent工具實(shí)現(xiàn)來(lái)看，我們必須捕獲每個(gè)鍵盤事件，并且發(fā)命令給設(shè)備，即發(fā)送命令不是以回車鍵為標(biāo)識(shí)。
2、??即使捕獲鍵盤事件，但是每個(gè)鍵盤（尤其是控制鍵）點(diǎn)擊時(shí)間要發(fā)送什么樣的命令需要我們特殊實(shí)現(xiàn)，termlib不提供這種處理，因?yàn)?/span>termlib僅僅做界面處理，并不是針對(duì)Telnet來(lái)實(shí)現(xiàn)的。
3、??對(duì)于設(shè)備返回的信息需要進(jìn)行處理后再讓termlib顯示。
4、??由于Telnet連接過(guò)程中有可能超時(shí)和異常，因此Web服務(wù)端需要向?yàn)g覽器push這些信息。
5、?Telnet連接需要進(jìn)行額外的管理。
B/S架構(gòu)Telnet工具實(shí)現(xiàn)思路
1、??如何捕獲原始的鍵盤敲擊事件？
通過(guò)覆蓋prototype方法keyHandler，將我們的事件處理替換原有的keyHandler事件處理，從而捕獲原始的鍵盤點(diǎn)擊事件：
[javascript] view plaincopy
function?customTerm(term){???????Terminal.prototype.globals.keyHandler=function(e)?{??????????????????。。。。。。???????};????}??
2、??如何處理鍵盤事件？
通過(guò)分析Telnet的協(xié)議處理，將鍵盤事件歸類如下
| 鍵盤 | 給設(shè)備的命令字節(jié) | 回顯處理 |
| Entry | 鍵盤Code（13） | 需要處理“刪除”字符 |
| ESC | 鍵盤Code | 直接關(guān)閉窗口 |
| LEFT | 27,91,68 | 根據(jù)telnet協(xié)議特殊處理 |
| RIGHT | 27,91,67 | 根據(jù)telnet協(xié)議特殊處理 |
| UP | 27,91,65 | 根據(jù)telnet協(xié)議特殊處理 |
| DOWN | 27,91,66 | 根據(jù)telnet協(xié)議特殊處理 |
| BS | 8 | 根據(jù)telnet協(xié)議特殊處理 |
| DEL | 127 | 根據(jù)telnet協(xié)議特殊處理 |
| TAB | 鍵盤Code | 根據(jù)telnet協(xié)議特殊處理 |
| 空格 | 鍵盤Code | 需要處理“刪除”字符 |
| 可打印字符 | 字符Code | 需要處理“刪除”字符 |
| Ctrl+Z | 字符Code（26） | 根據(jù)telnet協(xié)議特殊處理 |
| Ctrl+V | 字符Code（22） | 根據(jù)telnet協(xié)議特殊處理 |
| 其他特殊字符 | 不發(fā)送返回 | 不支持 |
3、??對(duì)于設(shè)備返回的信息如何處理？
將命令分類，分析規(guī)律，根據(jù)需要處理回顯字符，然后再根據(jù)需要現(xiàn)實(shí)，回顯處理可以參考上表，具體還需要在實(shí)現(xiàn)的時(shí)候進(jìn)一步分析
4、??服務(wù)端的信息的push方法？ jquery + cometd
5、??如何進(jìn)行telnet鏈接管理？
根據(jù)http session和Telnet服務(wù)端（設(shè)備）關(guān)鍵字，在業(yè)務(wù)層提供統(tǒng)一的Telnent連接管理，實(shí)現(xiàn)過(guò)程要考慮并發(fā)性問(wèn)題。
B/S架構(gòu)Telnet工具實(shí)現(xiàn)Demo
這個(gè)demo中實(shí)現(xiàn)了web版telnet工具的基本功能，很多特殊處理還需要在實(shí)際實(shí)現(xiàn)中完善，界面組織、用戶接入等等問(wèn)題也都需要在實(shí)際問(wèn)題中解決。
1、演示效果如下：
2、demo中的web層代碼如下：
?html層
[html] view plaincopy
<html>??<head>??<title>termlib?Socket?Sample</title>??<script?language="JavaScript"?type="text/javascript"?src="termlib.js"></script>??<script?language="JavaScript"?type="text/javascript"?src="easycrthelper.js"></script>??<script?language="JavaScript"?type="text/javascript"?src="easycrt.js"></script>??<style?type="text/css">??body,p,a,td,li?{??font-family:?courier,fixed,swiss,sans-serif;??font-size:?12px;??color:?#cccccc;??}??.lh15?{??line-height:?15px;??}??.term?{??font-family:?"Courier?New",courier,fixed,monospace;??font-size:?12px;??color:?#94aad6;??background:?none;??letter-spacing:?1px;??}??.term?.termReverse?{??color:?#232e45;??background:?#95a9d5;??}??a,a:link,a:visited?{??text-decoration:?none;??color:?#77dd11;??}??a:hover?{??text-decoration:?underline;??color:?#77dd11;??}??a:active?{??text-decoration:?underline;??color:?#eeeeee;??}??a.termopen,a.termopen:link,a.termopen:visited?{??text-decoration:?none;??color:?#77dd11;??background:?none;??}??a.termopen:hover?{??text-decoration:?none;??color:?#222222;??background:?#77dd11;??}??a.termopen:active?{??text-decoration:?none;??color:?#222222;??background:?#eeeeee;??}??table.inventory?td?{??padding-bottom:?20px?!important;??}??tt,pre?{??font-family:?courier,fixed,monospace;??color:?#ccffaa;??font-size:?12px;??line-height:?15px;??}??li?{??line-height:?15px;??margin-bottom:?8px?!important;??}??.dimmed,.dimmed?*,.dimmed?*?*?{??background-color:?#222222?!important;??color:?#333333?!important;??}??@media?print?{??body?{?background-color:?#ffffff;?}??body,p,a,td,li,tt?{??color:?#000000;??}??pre,.prop?{??color:?#000000;??}??h1?{??color:?#000000;??}??a,a:link,a:visited?{??color:?#000000;??}??a:hover?{??color:?#000000;??}??a:active?{??color:?#000000;??}??table.inventory?{??display:?none;??}??}??</style>??</head>??<body?bgcolor="#222222"?link="#77dd11"?text="#cccccc"?alink="#eeeeee"?vlink="#77dd11"?topmargin="0"?bottommargin="0"?leftmargin="0"?rightmargin="0"?marginheight="0"?marginwidth="0"?onload=termOpen()>????<div?id="termDiv"?style="position:absolute;?visibility:?hidden;?z-index:1;"></div>??</body>??</html>??
js 層
[javascript] view plaincopy
var?term;??var?help?=?[];??function?termOpen()??{????if?((!term)?||?(term.closed))????{??????term?=?new?Terminal(??????{????????cols:100,????????rows:36,????????x:?220,????????y:?70,????????blinkDelay:1000,????????crsrBlinkMode:true,????????ps:'',????????termDiv:?'termDiv',????????bgColor:?'#232e45',????????greeting:?help.join('\n'),????????handler:?termHandler,????????exitHandler:?myExitHandler??????}??????);??????customTerm(term);??????term.open();??????term.currentEvent=KeyEventDetail.prototype.getNomalDetail(10000);??????term.handler();????}??}????function?customTerm(term){?????Terminal.prototype.globals.keyHandler=function(e)?{??????????var?tg=Terminal.prototype.globals;??????????var?term=tg.activeTerm;??????????if?(tg.keylock?||?term.lock?||?term.isMac?&&?e?&&?e.metaKey)?return?true;??????????if?(window.event)?{??????????????if?(window.event.preventDefault)?window.event.preventDefault();??????????????if?(window.event.stopPropagation)?window.event.stopPropagation();??????????}??????????else?if?(e)?{??????????????if?(e.preventDefault)?e.preventDefault();??????????????if?(e.stopPropagation)?e.stopPropagation();??????????}??????????var?ch;??????????var?ctrl=false;??????????var?shft=false;??????????var?remapped=false;??????????var?termKey=term.termKey;??????????var?keyRepeat=0;??????????if?(e)?{??????????????ch=e.which;??????????????ctrl=((e.ctrlKey?&&?!e.altKey)?||?e.modifiers==2);??????????????shft=(e.shiftKey?||?e.modifiers==4);??????????????if?(e._remapped)?{??????????????????remapped=true;??????????????????if?(window.event)?{????????????????????????????????????????????ctrl=(ctrl?||?(window.event.ctrlKey?&&?!window.event.altKey));??????????????????????shft=(shft?||?window.event.shiftKey);??????????????????}??????????????}??????????????if?(e._repeated)?{??????????????????keyRepeat=2;??????????????}??????????????else?if?(e._repeat)?{??????????????????keyRepeat=1;??????????????}??????????}??????????else?if?(window.event)?{??????????????ch=window.event.keyCode;????????????????????????????ctrl=(window.event.ctrlKey?&&?!window.event.altKey);???????????????shft=(window.event.shiftKey);??????????????if?(window.event._repeated)?{??????????????????keyRepeat=2;??????????????}??????????????else?if?(window.event._repeat)?{??????????????????keyRepeat=1;??????????????}??????????}??????????else?{??????????????return?true;??????????}??????????if?(ch==''?&&?remapped==false)?{????????????????????????????if?(e==null)?e=window.event;??????????????if?(e.charCode==0?&&?e.keyCode)?{??????????????????if?(e.DOM_VK_UP)?{??????????????????????var?dkr=tg.termDomKeyRef;??????????????????????for?(var?i?in?dkr)?{??????????????????????????if?(e[i]?&&?e.keyCode?==?e[i])?{??????????????????????????????ch=dkr[i];??????????????????????????????break;??????????????????????????}??????????????????????}??????????????????}??????????????????else?{????????????????????????????????????????????if?(e.keyCode==28)?{?ch=termKey.LEFT;?}??????????????????????else?if?(e.keyCode==29)?{?ch=termKey.RIGHT;?}??????????????????????else?if?(e.keyCode==30)?{?ch=termKey.UP;?}??????????????????????else?if?(e.keyCode==31)?{?ch=termKey.DOWN;?}????????????????????????????????????????????else?if?(e.keyCode==37)?{?ch=termKey.LEFT;?}??????????????????????else?if?(e.keyCode==39)?{?ch=termKey.RIGHT;?}??????????????????????else?if?(e.keyCode==38)?{?ch=termKey.UP;?}??????????????????????else?if?(e.keyCode==40)?{?ch=termKey.DOWN;?}????????????????????????????????????????????else?if?(e.keyCode==9)?{?ch=termKey.TAB;?}??????????????????}??????????????}??????????}????????????????????if?((ch>=0xE000)?&&?(ch<=?0xF8FF))?return;??????????if?(keyRepeat)?{??????????????tg.clearRepeatTimer();??????????????tg.keyRepeatTimer?=?window.setTimeout(??????????????????'Terminal.prototype.globals.doKeyRepeat('+ch+')',??????????????????(keyRepeat==1)??tg.keyRepeatDelay1:tg.keyRepeatDelay2??????????????);??????????}??????????if?(!ctrl)?{????????????????????????????if?(ch==termKey.CR)?{??????????????????term.lock=true;??????????????????term.cursorOff();??????????????????term.insert=false;??????????????????term.lineBuffer=term._getLine(true);??????????????????if?(??????????????????????term.lineBuffer!=''?&&??????????????????????(!term.historyUnique?||?term.history.length==0?||??????????????????????term.lineBuffer!=term.history[term.history.length-1])??????????????????????)?{??????????????????????term.history[term.history.length]=term.lineBuffer;??????????????????}??????????????????term.histPtr=term.history.length;??????????????????term.lastLine='';??????????????????term.inputChar=0;??????????????????term.currentEvent=KeyEventDetail.prototype.getSpeciclDetail(ch);??????????????????term.handler();??????????????????term.lock=false;??????????????????term.cursorOn();??????????????????term.insert=true;??????????????????if?(window.event)?window.event.cancelBubble=true;??????????????????return?false;??????????????}??????????????else?if?(ch==termKey.ESC?&&?term.conf.closeOnESC)?{??????????????????term.close();??????????????????if?(window.event)?window.event.cancelBubble=true;??????????????????return?false;??????????????}????????????????{??????????????????if?(ch==termKey.LEFT)?{????????????????????????????????????????????term.currentEvent=KeyEventDetail.prototype.getSpeciclDetail(ch);??????????????????????term.handler();??????????????????????????????????????????????????????????????????????????????????????????????????????????????if?(window.event)?window.event.cancelBubble=true;??????????????????????return?false;??????????????????}??????????????????else?if?(ch==termKey.RIGHT)?{????????????????????????????????????????????term.currentEvent=KeyEventDetail.prototype.getSpeciclDetail(ch);??????????????????????term.handler();??????????????????????if?(window.event)?window.event.cancelBubble=true;??????????????????????return?false;??????????????????}??????????????????else?if?(ch==termKey.UP)?{??????????????????????term.cursorOff();??????????????????????????????????????????????????????term.currentEvent=KeyEventDetail.prototype.getSpeciclDetail(ch);??????????????????????term.handler();??????????????????????term.cursorOn();??????????????????????if?(window.event)?window.event.cancelBubble=true;??????????????????????return?false;??????????????????}??????????????????else?if?(ch==termKey.DOWN)?{??????????????????????term.cursorOff();???????????????????????????????????????????????????????????term.currentEvent=KeyEventDetail.prototype.getSpeciclDetail(ch);??????????????????????term.handler();??????????????????????term.cursorOn();??????????????????????if?(window.event)?window.event.cancelBubble=true;??????????????????????return?false;??????????????????}??????????????????else?if?(ch==termKey.BS)?{????????????????????????????????????????????term.currentEvent=KeyEventDetail.prototype.getSpeciclDetail(ch);??????????????????????term.handler();??????????????????????if?(window.event)?window.event.cancelBubble=true;??????????????????????return?false;??????????????????}??????????????????else?if?(ch==termKey.DEL)?{???????????????????????????????????????????????????term.currentEvent=KeyEventDetail.prototype.getSpeciclDetail(ch);??????????????????????term.handler();??????????????????????if?(window.event)?window.event.cancelBubble=true;??????????????????????return?false;??????????????????}??????????????}??????????}????????????????????{??????????????if?(term.conf.catchCtrlH?&&?(ch==termKey.BS?||?(ctrl?&&?ch==72)))?{??????????????????????????????????????????????????????term.currentEvent=KeyEventDetail.prototype.getSpeciclDetail(0);??????????????????term.handler();??????????????????if?(window.event)?window.event.cancelBubble=true;??????????????????return?false;??????????????}??????????????else?if?(term.ctrlHandler?&&?(ch<32?||?(ctrl?&&?term.isPrintable(ch,true))))?{??????????????????if?((ch>=65?&&?ch<=96)?||?ch==63)?{????????????????????????????????????????????if?(ch==63)?{??????????????????????????ch=31;??????????????????????}??????????????????????else?{??????????????????????????ch-=64;??????????????????????}??????????????????}??????????????????term.inputChar=ch;????????????????????????????????????term.currentEvent=KeyEventDetail.prototype.getSpeciclDetail(0);??????????????????term.handler();??????????????????if?(window.event)?window.event.cancelBubble=true;??????????????????return?false;??????????????}??????????????else?if?(ctrl?||?!term.isPrintable(ch,true))?{??????????????????if(ctrl?&&?ch==122||ctrl?&&?ch==90){??????????????????????term.currentEvent=KeyEventDetail.prototype.getSpeciclDetail(26);??????????????????}else?if(ctrl?&&?ch==118||ctrl?&&?ch==86){??????????????????????term.currentEvent=KeyEventDetail.prototype.getSpeciclDetail(22);??????????????????}else{??????????????????????term.currentEvent=KeyEventDetail.prototype.getSpeciclDetail(0);??????????????????}??????????????????term.handler();??????????????????if?(window.event)?window.event.cancelBubble=true;??????????????????return?false;??????????????}??????????????else?if?(term.isPrintable(ch,true))?{??????????????????if?(term.blinkTimer)?clearTimeout(term.blinkTimer);???????????????????????????????????????????if?(ch==32?&&?window.event)?{??????????????????????window.event.cancelBubble=true;??????????????????}??????????????????else?if?(window.opera?&&?window.event)?{??????????????????????window.event.cancelBubble=true;??????????????????}??????????????????term.currentEvent=KeyEventDetail.prototype.getNomalDetail(ch);??????????????????term.handler();??????????????????term.lock=false;??????????????????term.cursorOn();??????????????????term.insert=true;??????????????????return?false;??????????????}??????????}??????????return?true;?????};??}????function?termHandler()?{??????????var?keyEvent=this.currentEvent;??????????var?termpCharCode=0;??????????var?sendStr="0";??????????if(keyEvent){??????????????termpCharCode=keyEvent.inputchar;??????????????sendStr=String(termpCharCode);??????????}else{??????????????return;??????????}??????????if(keyEvent.isSpecial){??????????????if(keyEvent.isSupport){??????????????????sendStr=keyEvent.getSendCmd();??????????????}else{??????????????????return?;??????????????}??????????}??????????var?myDataObject?=?{????????????????charCode:?sendStr,????????????????ipaddress:?"10.46.60.69"??????????};??????????this.send(??????????{????????????url:?"demoApp/easyCRT.action",????????????method:?'get',????????????callback:?myServerCallback,????????????data:?myDataObject??????????}???????);??}??????function?myServerCallback()??{????var?response=this.socket;????if?(response.success)????{??????var?func=null;??????try{????????func=eval(response.responseText);??????}catch?(e){??????}??????if?(typeof?func=='function'){????????try{??????????func.apply(this);????????}catch(e){??????????this.write('An?error?occured?within?the?imported?function:?'+e);????????}??????}else{????????var?respText=response.responseText;????????var?temptg=Terminal.prototype.globals;????????var?tempterm=temptg.activeTerm;????????var?keyEvent=tempterm.currentEvent;????????if(keyEvent.isSpecial&&keyEvent.isSupport){??????????????var?flag=keyEvent.inputchar;??????????????switch?(flag){??????????????????case?Terminal.prototype.globals.termKey.CR:??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.LEFT:??????????????????????leftkey(tempterm,respText);??????????????????????return;??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.RIGHT:??????????????????????rightkey(tempterm,respText);??????????????????????return;??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.UP:??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.DOWN:??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.BS:??????????????????????break;??????????????????case?KeyEventDetail.prototype.specialKeysSupported.CTRLZ:??????????????????????break;??????????????????case?KeyEventDetail.prototype.specialKeysSupported.CTRLV:??????????????????????break;??????????????????default:??????????????????????;??????????????}???????}????????respText=keyEvent.preResponText(respText,tempterm);????????var?text=HelperUtil.prototype.removeCharbyDelIndex(respText);????????this.write(respText);??????}????}????else????{??????var?s='Request?failed:?'?+?response.status?+?'?'?+?response.statusText;??????if?(response.errno)?s?+=?'\n'?+?response.errstring;??????this.write(s);????}??}????function?leftkey(tempterm,respText){??????if(respText){??????????tempterm.cursorLeft();??????}??}??function?rightkey(tempterm,respText){??????if(respText){??????????tempterm.cursorRight();??????}??}??????function?myExitHandler()??{????var?mainPane?=?(document.getElementById)?????document.getElementById('mainPane')?:?document.all.mainPane;????if?(mainPane)?mainPane.className?=?'lh15';??}??
[javascript] view plaincopy
function?KeyEventDetail(){??????this.inputchar='';??????this.isSpecial=false;??????this.isSupport=true;??????this.isControl=false;??????this.isShift=false;??????this.getSendCmd=function(){??????????var?sendStrTemp=String(this.inputchar);??????????if(this.isSpecial){??????????????var?flag=this.inputchar;??????????????switch?(flag){??????????????????case?Terminal.prototype.globals.termKey.CR:??????????????????????sendStrTemp=String(this.inputchar);??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.LEFT:??????????????????????sendStrTemp="27,91,68";??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.RIGHT:??????????????????????sendStrTemp="27,91,67";??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.UP:??????????????????????sendStrTemp="27,91,65";??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.DOWN:??????????????????????sendStrTemp="27,91,66";??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.BS:??????????????????????sendStrTemp="8";??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.DEL:??????????????????????sendStrTemp="127";??????????????????????break;??????????????????case?KeyEventDetail.prototype.specialKeysSupported.CTRLZ:??????????????????????sendStrTemp="26";??????????????????????break;??????????????????case?KeyEventDetail.prototype.specialKeysSupported.CTRLV:??????????????????????sendStrTemp="22";??????????????????????break;??????????????????default:??????????????????????;??????????????}??????????}??????????return?sendStrTemp;??????};??????this.preResponText=function(respText,term){??????????if(this.isSpecial&&this.isSupport){??????????????var?flag=this.inputchar;??????????????switch?(flag){??????????????????case?Terminal.prototype.globals.termKey.CR:??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.LEFT:??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.RIGHT:??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.UP:??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.DOWN:??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.BS:??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.DEL:??????????????????????break;??????????????????case?KeyEventDetail.prototype.specialKeysSupported.CTRLZ:??????????????????????break;??????????????????case?KeyEventDetail.prototype.specialKeysSupported.CTRLV:??????????????????????break;??????????????????default:??????????????????????;??????????????}??????????}??????????return?respText;??????};??}????KeyEventDetail.prototype={????????specialKeysSupported:{??????????'CR':?Terminal.prototype.globals.termKey.CR,??????????'LEFT':?Terminal.prototype.globals.termKey.LEFT,??????????'RIGHT':?Terminal.prototype.globals.termKey.RIGHT,??????????'UP':?Terminal.prototype.globals.termKey.UP,??????????'DOWN':?Terminal.prototype.globals.termKey.DOWN,??????????'BS':?Terminal.prototype.globals.termKey.BS,??????????'DEL':?Terminal.prototype.globals.termKey.DEL,??????????'CTRLZ':?26,??????????'CTRLV':?22??????},??????getNomalDetail:function(charValue){??????????var?currentEvent=new?KeyEventDetail();??????????currentEvent.inputchar=charValue;??????????return?currentEvent;??????},??????getSpeciclDetail:function(charValue){??????????var?detail=?KeyEventDetail.prototype.getDefaultSpecialDetail(charValue);??????????switch?(charValue){??????????????????case?Terminal.prototype.globals.termKey.CR:??????????????????????detail=KeyEventDetail.prototype.getEnterDetail();??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.LEFT:??????????????????????detail=KeyEventDetail.prototype.getLeftDetail();??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.RIGHT:??????????????????????detail=KeyEventDetail.prototype.getRightDetail();??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.UP:??????????????????????detail=KeyEventDetail.prototype.getUpDetail();??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.DOWN:??????????????????????detail=KeyEventDetail.prototype.getDownDetail();??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.BS:??????????????????????detail=KeyEventDetail.prototype.getBsDetail();??????????????????????break;??????????????????case?Terminal.prototype.globals.termKey.DEL:??????????????????????detail=KeyEventDetail.prototype.getDelDetail();??????????????????????break;??????????????????case?KeyEventDetail.prototype.specialKeysSupported.CTRLZ:??????????????????????detail=KeyEventDetail.prototype.getCtrlzDetail();??????????????????????break;??????????????????case?KeyEventDetail.prototype.specialKeysSupported.CTRLV:??????????????????????detail=KeyEventDetail.prototype.getCtrlvDetail();??????????????????????break;??????????????????default:??????????????????????;??????????}??????????return?detail;??????},??????getDefaultSpecialDetail:function(chatValue){??????????var?currentEvent=new?KeyEventDetail();??????????currentEvent.inputchar=chatValue;??????????currentEvent.isSpecial=true;??????????currentEvent.isSupport=false;??????????return?currentEvent;??????},??????getEnterDetail:function(){??????????var?currentEvent=new?KeyEventDetail();??????????currentEvent.inputchar=Terminal.prototype.globals.termKey.CR;??????????currentEvent.isSpecial=true;??????????return?currentEvent;??????},??????getLeftDetail:function(){??????????var?currentEvent=new?KeyEventDetail();??????????currentEvent.inputchar=Terminal.prototype.globals.termKey.LEFT;??????????currentEvent.isSpecial=true;??????????return?currentEvent;??????},??????getRightDetail:function(){??????????var?currentEvent=new?KeyEventDetail();??????????currentEvent.inputchar=Terminal.prototype.globals.termKey.RIGHT;??????????currentEvent.isSpecial=true;??????????return?currentEvent;??????},??????getUpDetail:function(){??????????var?currentEvent=new?KeyEventDetail();??????????currentEvent.inputchar=Terminal.prototype.globals.termKey.UP;??????????currentEvent.isSpecial=true;??????????return?currentEvent;??????},??????getDownDetail:function(){??????????var?currentEvent=new?KeyEventDetail();??????????currentEvent.inputchar=Terminal.prototype.globals.termKey.DOWN;??????????currentEvent.isSpecial=true;??????????return?currentEvent;??????},??????getBsDetail:function(){??????????var?currentEvent=new?KeyEventDetail();??????????currentEvent.inputchar=Terminal.prototype.globals.termKey.BS;??????????currentEvent.isSpecial=true;??????????return?currentEvent;??????},??????getDelDetail:function(){??????????var?currentEvent=new?KeyEventDetail();??????????currentEvent.inputchar=Terminal.prototype.globals.termKey.DEL;??????????currentEvent.isSpecial=true;??????????return?currentEvent;??????},??????getCtrlzDetail:function(){??????????var?currentEvent=new?KeyEventDetail();??????????currentEvent.inputchar=KeyEventDetail.prototype.specialKeysSupported.CTRLZ;??????????currentEvent.isSpecial=true;??????????return?currentEvent;??????},??????getCtrlvDetail:function(){??????????var?currentEvent=new?KeyEventDetail();??????????currentEvent.inputchar=KeyEventDetail.prototype.specialKeysSupported.CTRLZ;??????????currentEvent.isSpecial=true;??????????return?currentEvent;??????}??????????}????function?HelperUtil(){??}??HelperUtil.prototype={????????removeCharbyDelIndex:function(text){???????????????return?text;??????}????????}??
3、demo中的服務(wù)端代碼：略
總結(jié)
以上是生活随笔為你收集整理的Web版Telnet工具设计与实现的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。
