大家看看華為商城的客服系統，有沒有想過到底是如何制作出來的。你和客服MM的一問一答到底是如何實現的？學過ajax的朋友肯定知道，可以使用輪詢方式，隔一秒到服務器里面去查詢是否有聊天信息的到來，如果有，就取出來。這樣肯定是可以的。但是這樣做服務器壓力實在太大。如果有很多人在聊天呢？服務器可能受不了，所以，我們今天來使用WebSocket技術。該技術的特別之處在于，與HTTP協議最大的不同是，HTTP協議需要請求一次，響應一次。而WebSocket使用的是協議是，一次握手，時時通訊。意思就是，第一次采用http協議握手完成之后，后面的鏈接就一直會保持，服務器也可以向客戶端發送信息。而不再是單向的通訊方式了。
華為客服系統
當然，制作這個客服聊天系統確實不容易，但是如果我們只想做個簡單的網頁聊天那還是沒有問題的。
接下來，我給大家貼出一些關鍵代碼，給大家演示如何開發出一個網頁聊天系統。
必備技能：
html，css，JAVAScript，java，javaWeb，Tomcat服務器，數據庫MySQL。
1 首頁，必須寫一個登陸頁面，如果沒有登錄功能，那么網頁對方就不知道你的身份了。大部分情況都是需要登錄的。當然如果不登錄，也是可以的，系統可以給你指定一個稱呼，目前大多數客服系統都是 有登錄的。
登錄代碼
登錄界面
登錄使用的是jquery的ajax向servlet發送請求，servlet調用數據庫dao查詢是否存在賬號。這個步驟如果不會的話，那需要將JavaScript和javaWeb學習一遍。
2 寫一個聊天的界面，這個界面代碼較多，但是大家可以去各種素材網站找模板，不用自己寫的，copy就行了。
登錄后的界面
webSocket代碼
后臺，我們采用的是java代碼。這里因為是入門，我們沒有采用spring框架，而是采用了最基本的webSocket包。這兩個包可以在tomcat文件夾下面的lib文件夾找到。
使用的包
前后臺通訊方式采用的是json方式。所以引入了Gson包。
數據庫使用了兩個表：
非常簡單的表，mysql可以直接使用
后臺部分代碼
主要使用的是@ServerEndpoint注解，以及@OnOpen@OnMessage注解。
@ServerEndpoint注解表示ws的路徑。
@OnOpen表示連接時觸發該方法
@OnMessage 表示服務器收到消息時觸發
聊天時可以發送圖片和表情
發送圖片文件采用的方式還是http方式。
將發送人和接收人和文件使用FormData封裝起來，然后使用ajax保存到服務器中。然后再將服務器保存的地址發給對方。
聊天系統沒有加密。只是簡單的制作。有興趣的可以私聊我，可以發源代碼給你，因為平臺限制，不能在文章發鏈接，見諒了。
