WebSocket+HTML5實現在線聊天室

最近在看HTML5的東西,我比較感興趣的是WebSockets,WebWorker以及CORS。去官方過了下WebSockets的規範。WebSockets在Web層實現了TCP協議來進行雙向通信,使得程序員們不用再苦逼苦的以各種方式模擬這種雙向通信了。

這裏用純WebSockets+HTML5的一些新特性實現了一個在線聊天室的功能。
前端是我永遠的痛,好在有Bootstrap:)
服務端基於mod_pywebsocket,客戶端就一個html。
實現一個聊天室不難,實現一個穩定的聊天室就要多做些工作了。
使用心跳包定時kill掉無動作的客戶端,解決了非正常退出聊天室造成的zombie連接。
數據對象以json的形式在客戶端和服務端之間傳送
 
當然還有頁面上的一些細節:當前用戶名粗體顯示,頭像識別性別等。 
沒有實現太多其他的功能,實際體驗下WebSockets就好了。
 
mod_pywebsocket的安裝過程不說了,下載源碼包然後執行install.py。
啓動客戶端,standlone,py位於mod_pywebsocket的源碼包中。
 
  1. python standlone.py -p 2012 -d /root/Destop/talk2me/ 
 
然後瀏覽器直接訪問127.0.0.1:2012/chatroom.html即可

模擬一段基友聊天場景作爲YY:

源碼下載 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章