PHP框架+gatewayworker实如今线1对1聊天--吸取消息（7）

吸取消息的原理

吸取消息，就是担当服务器转发的客户端消息。并不必要单独创建函数，因为 ws.onmessage会主动吸取消息。我们必要在这个函数里举行处理。因为初始化的时间，已经处理的init类型的消息。这次处理text类型的消息。把吸取到的消息展示在聊天窗口左侧，追加而已。

吸取消息

JavaScript代码

1. ws.onmessage=function (e){
2.         // json数据转换成js对象
3.         var data = eval("("+e.data+")");
4.         var type = data.type || '';
5.         console.log(data)
6.         switch(type){
7.            // Events.php中返回的init类型的消息，将client_id发给后台进行uid绑定
8.             case 'init':
9.                 // 利用jquery发起ajax请求，将client_id发给后端进行uid绑定
10.                 $.post('/chat.php/Chat/bind', {client_id: data.client_id}, function(data){}, 'json');                              
11.                 break;
12.             // 当mvc框架调用GatewayClient发消息时直接alert出来
13.             case 'text':
14.                 var content=data.content;
15.                 var content_type=data.content_type;
16.                 var f_id=data.from_id;
17.                 if (f_id !=to_id){
18.                     //不接收其他人给当前用户发来的消息在此展示
19.                     /*
20.                     如果当前用户为a，和b、c同时聊天，应该是打开两个聊天界面。
21.                     但是b、c给发送的消息都会发给a，a的两个界面同时接收。
22.                     就会造成消息乱展示。所以，如果不是当前聊天的对方发来的消息，就不展示。
23.                     */
24.                 }else{
25.                     var html=render_accept(content,content_type);
26.                     $('#chat_content').append(html);
27.                 }
28.                 break;
29.             // 当mvc框架调用GatewayClient发消息时直接alert出来
30.             case "logout":
31.                 console.log('掉线了')
32.                 break;
33.             default :
34.                 alert(e.data);
35.         }
36.     }
37.     //接收到的消息渲染，渲染对方的消息，在左侧。
38.     function render_accept(content,content_type) {
39.         var html='<div class="media">' +
40.             '            <div class="media-left">' +
41.             '                <img class="media-object avatar" src="'+to_avatar+'" alt="...">' +
42.             '            </div>' +
43.             '            <div class="media-body">' +
44.             '                <h4 class="media-heading">'+to_user_name+'</h4>' ;
45.         if(content_type==1){
46.             html+='                <p class="chat_msg_left">'+content+'</p>' ;
47.         }
48.         if(content_type==2 ){
49.             html+='                <p class="chat_msg_left"><img src="'+content+'"/></p>' ;
50.         }
51.         if(content_type==3 ){
52.             html+='                <p class="chat_msg_left"><img src="'+content+'" class="emoj_w"/></p>' ;
53.         }
54.         html+=
55.             '            </div>' +
56.             '        </div>';
57.         return html;
58.     }

复制代码

到这里，吸取消息就做完了。

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。