Coldfusion Websockets“用户正在输入...”功能

我正在玩Coldfusion 10的websockets并做了一个简单的聊天测试。我看过几个聊天，他们有“用户正在输入...”文本，当其他用户正在输入时显示。有谁知道如何有效地实现这一点？Coldfusion Websockets“用户正在输入...”功能

来源

2013-05-27 Guest

创建另一个通道“通知”并在用户在'keyUp'执行'keyDown'和'emptystring'时发布'User is typing'。

订阅此频道随你聊天。在接收端的这个频道的目标应该是一个内部的html可以填充'User is Typing'消息。

伪代码：

<cfwebsocket name="notificationSocket" 
      onmessage="notifyHandler" 
      subscribeto="notificationChannel" > 

<cfwebsocket name="ChatSocket" 
      onmessage="chatHandler" 
      subscribeto="chatChannel" > 

<!-- Conversation displayer --> 
<div id="messageBoard"></div> 

<!-- your text message input area --> 
<textarea onKeyDown="sayTyping()" onKeyUp="sayStopped()" id="chatInput"></textarea> 
<div id="notifyArea"></div> 
<input name="submit" onClick="publishMessage()"></textarea> 

<script> 

    /*chat Functions*/ 
    var publishMessage = function(){ 
     var msg = document.getElementById('chatInput').value; 
     mycfwebsocketobject.publish("chatChannel", msg); 
    }; 

    var chatHandler = function(msgObj){ 
     document.getElementById('messageBoard').innerHTML += ColdFusion.JSON.encode(msgObj); 
    }; 


    /*notifying Functions*/ 
    var notifyHandler = function(noteObj){ 
     document.getElementById('notifyArea').innerHTML = ColdFusion.JSON.encode(noteObj); 
    };  

    var sayTyping = function(){ 
     mycfwebsocketobject.publish("notificationchannel","User is Typing..."); 
    }; 
    var sayStopped = function(){ 
     mycfwebsocketobject.publish("notificationchannel",""); 
    }; 

</script>

另一个增强将有一个div已经与文本“用户键入”和频道广播文本“秀”和“NOSHOW”。这基本上是给予显示和隐藏它的类名称。较少的流量。

方法2：使用相同的信道

<cfwebsocket name="ChatSocket" 
      onmessage="chatHandler" 
      subscribeto="chatChannel" > 

<!-- Conversation displayer --> 
<div id="messageBoard"></div> 

<!-- your text message input area --> 
<textarea onKeyDown="sayTyping()" onKeyUp="sayStopped()" id="chatInput"></textarea> 
<div id="notifyArea" class="no">User is typing...</div> 
<input name="submit" onClick="publishMessage()"></textarea> 

<script> 

    /*chat Functions*/ 
    var publishMessage = function(){ 
     var msg = document.getElementById('chatInput').value; 
     mycfwebsocketobject.publish("chatChannel", msg); 
    }; 

    var chatHandler = function(msgObj){ 
     var msg = ColdFusion.JSON.encode(msgObj); 
     if (msg == '@[email protected]'){ 
      notifyHandler('yes'); 
     } 
     else if (msg == '@[email protected]'){ 
      notifyHandler('no'); 
     } 
     else { 
      document.getElementById('messageBoard').innerHTML += msg; 
     } 
    }; 


    /*notifying Functions*/ 
    var notifyHandler = function(action){ 

     document.getElementById('notifyArea').className = action; 

     /*call the notify handler with off to stop showing the user is typing message 
     after a certain interval of time. This is to avoid someone believing that 
     partner is still typing even when the connection is lost*/ 

     if(action == 'on'){ 
      setTimeout(function(){notifyHandler('no')},250); 
     } 
    };  

    var sayTyping = function(){ 
     mycfwebsocketobject.publish("chatChannel","@[email protected]"); 
    }; 
    var sayStopped = function(){ 
     mycfwebsocketobject.publish("chatChannel","@[email protected]"); 
    }; 

</script> 
<style> 
.yes { display:block;} 
.no { display:none;} 
</style>

人们总是可以通过键入消息为 '@ userTyping @ -yes' 或 '@ userTyping @ -no' 特技此代码。但正如我所说，这只是一个POC。另外，对于你提到的超时，keyUp会照顾它。但是你也可以通过setTimeout（）来调用notifyHandler（），如上所示。

来源

2013-05-29 03:01:51 Sanjeev

感谢您的例子。唯一的问题是，我正在使用websocket进行Live Help Chat聊天，因此对话将是一对一的，而不是向频道中的每个人播放。我是否需要为发起的每个聊天的notificationSocket创建唯一的子通道？另外，如果有超时，所以它不会持续更新每个按下的按键？ – Guest

在这种情况下，您可以使用相同的渠道并根据逻辑来区分传入消息是“通知”还是聊天消息。 – Sanjeev

因此，实现一对一聊天的最佳方式就像实时帮助聊天一样，只需一个通道并通过ID进行过滤？ – Guest

评论内容是关于如何过滤一对一消息的问题。以下是实现此目的的一些示例代码。

而不是使用subscribeTo属性，使用js函数订阅用户并传入一些标头值。然后，这些报头可被用作过滤器上使用selector

实施例的发布调用：

<cfwebsocket name="ChatSocket" onOpen="openHandler" onMessage="msgHandler" onError="errHandler"> 

<script> 
    function openHandler(){ 
     //Subscribe to the channel, pass in headers for filtering later 
     ChatSocket.subscribe('chatChannel',{name: '#Session.Auth.FirstName#', UserID: '#Session.Auth.UserID#', AccountID: '#Session.Auth.AccountID#' }); 
    } 

    function publish(txt, userID){ 
     var msg = { 
      AccountID: "#Session.Auth.AccountID#", 
      publisher: '#Session.Auth.UserID#', 
      id: userID, 
      message: converthtml(txt) 
     }; 
     //When including headers, the "selector" is where you will filter who it goes to. 
     var headers = { 
      AccountID: "#Session.Auth.AccountID#", 
      publisher: '#Session.Auth.UserID#', 
      id: userID, 
      selector: "UserID eq '"+userID+"' and AccountID eq '#Session.Auth.AccountID#'" 
     }; 
     ChatSocket.publish('chatChannel',msg, headers); 

    } 

    function msgHandler(message){ 
     console.log(message); 
    } 

    function errHandler(err){ 
     console.log(err); 
    } 
</script>

来源

2013-12-04 17:42:57

Coldfusion Websockets“用户正在输入...”功能

回答

相关问题