ASP. NET SignalR with Layim, easy to implement website customer Service chat Room (v) Supplement: History and Message reminders

Source: Internet
Author: User

There are developer questions about how to do the history function and even if you do not open the Chat window there is a Message alert feature. Simple time to write a bit of code. But the basic idea, the specific details are not realized.

As mentioned in the previous blogs, when does the read history read? In common sense, it should be the time to open the Chat window to load the history, of course, you can choose to load it asynchronously, and then open which window to load which part of the record. Of course, we don't know which window the user will open, so I recommend that you read the history when the user chooses to chat. Then the previous function has been done. We need to make full use of the Ctoc method. What is CTOC? If you don't understand, look at the previous articles in this series.

Now we find the CTOC back-end method, you can see that I added the Gethistorymessage method, the parameter is the Sender ID and the recipient ID, then this gethistorymessage method is to do the reading history of the operation, no matter where you read from, is the cache or the database (if you sent the message has been saved ~ ~)

 /// <summary>        ///person to Person Chat connection Server/// </summary>        /// <param name= "Sendid" >Sending Person</param>        /// <param name= "Receiveid" >Receiving Person</param>        /// <returns></returns>         PublicTask Clienttoclient (stringSendid,stringReceiveid) {            if(Sendid = =NULL|| Receiveid = =NULL) {Throw NewArgumentNullException ("Sendid or Receiveid can ' t be null"); }            //Get group name            stringGroupName =messageutils.getgroupname (Sendid, Receiveid); //Add the current user to this organizationGroups.add (Currentuserconnectionid, groupName); //Build System Connection Success Message//Read History---2016-3-7 revision            varHistorymsg =messageutils.gethistorymessage (Sendid, Receiveid); varmsg = Messageutils.getsystemmessage (GroupName, Messageconfig.clienttoclientconnectedsucceed,New{t = messageconfig.clienttypectc, CurrentID = sendid, Receiveid = Receiveid,history =historymsg}); //push messages to the current group (A and B chat groups) also call the ReceiveMessage method                       returnClients.Caller.receiveMessage (msg); }

Let's take a look at what we've done to get the history, first of all, the message format that he returns must conform to our design criteria. To facilitate the delivery and reception of a single message

    Public StaticList<cschatmessage> Gethistorymessage (stringSendid,stringReceiveid) {            stringGroupName =getgroupname (Sendid, Receiveid); List<CSChatMessage> Historys =NewList<cschatmessage>(); //Here The history is used as a demo and can be read from the database or the cacheHistorys. ADD (NewCschatmessage {fromuser=NewCsuser (GroupName,NULL) {Photo="/photos/000.jpg", UserID=int. Parse (Sendid), username="Sender's name"}, MSG="This is a historical record .", Msgtype=Csmessagetype.custom, Touser=NewCsuser (GroupName,NULL) {Photo="/photos/001.jpg", UserID=int. Parse (Receiveid), username="the name of the receiving party"}, other=New{t = MESSAGECONFIG.CLIENTTYPECTC}//don't forget to add the T parameter here            }); Historys. ADD (NewCschatmessage {touser=NewCsuser (GroupName,NULL) {Photo="/photos/000.jpg", UserID=int. Parse (Sendid), username="Sender's name"}, MSG="This is a historical record .", Msgtype=Csmessagetype.custom, Fromuser=NewCsuser (GroupName,NULL) {Photo="/photos/001.jpg", UserID=int. Parse (Receiveid), username="the name of the receiving party"}, other=New{t = MESSAGECONFIG.CLIENTTYPECTC}//don't forget to add the T parameter here            }); Historys. ADD (NewCschatmessage {fromuser=NewCsuser (GroupName,NULL) {Photo="/photos/000.jpg", UserID=int. Parse (Sendid), username="Sender's name"}, MSG="This is a historical record .", Msgtype=Csmessagetype.custom, Touser=NewCsuser (GroupName,NULL) {Photo="/photos/001.jpg", UserID=int. Parse (Receiveid), username="the name of the receiving party"}, other=New{t = MESSAGECONFIG.CLIENTTYPECTC}//don't forget to add the T parameter here            }); returnHistorys; }

In fact, it adds a read history operation, let's see, after the connection succeeds, the message returns JSON.

The history is there, and what we have left to do is very simple. Modifies the front-end processing of message functions of the system type. (Code in CLIENT.HUB.JS/CHAT.HANDLESYSTEMMSG)

handlesystemmsg:function (Result) {if(RESULT.OTHER.T = =' One') {                 This. Cache[result.other.receiveid] ="OK";//on behalf of me already and the current chat person already connected, next click No need to connect again}Else {                 This. Cachegroup[result.other.receiveid] ="OK"; }            //and then process the history here 2016-3-7            if(Result.other.history &&result.other.history.length) {$ (result.other.history). each (function (I,item) {//Append MessageConsole.log (item); Chat.handlecustommsg (item);//Each item is a message, and the format is generic, so call the Handlecustommsg method directly.                 }); }        },

Let's look at the effect:

is not so simple to achieve the function of historical records, of course, if the actual project, if the scroll bar pull can see more history, there is no need to signalr, we use an AJAX request on it.

Here's an introduction to message notifications. In fact, the principle of message notification is to enter the page when users need to connect to the server, whenever there is a user message will be prompted. Because the previous design idea is that when the user clicks on someone to chat, they will connect, so even if the user is logged in to the webpage, they will not receive messages sent to him by other people. So all we have to do is let the user connect to the server first. I simulate a connection here, which is to open the window and then close it. (At this point the user is connected, able to receive the message, but not displayed in the window) add the following code: (Code path: client.hub.js/chat.handlecustommsg)

if (! log.imarea.length) {                // There is only one connection once, and closing the message box will prompt                if ( Result.touser.userid = = hubConfig.currentUser.id) {                    alert (" you receive the message ... " );                }            }

When the other side to send me a message will be prompted: (PS: Here is just a train of thought, specifically, no one to send a message will prompt. The alert box is not very ugly, so let your art to optimize it. )

GitHub code has been updated: https://github.com/fanpan26/LayIM/

ASP. NET SignalR with Layim, easy to implement website customer Service chat Room (v) Supplement: History and Message reminders

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.