在SignalR聊天

Question

这是ChatHub代码：

using System;
using System.Collections.Concurrent;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using System.Web;
using Microsoft.AspNet.SignalR;

namespace BIX
{
    public class ChatHub : Hub
    {
        static ConcurrentDictionary<string, string> dic = new ConcurrentDictionary<string, string>();
        public void Send(string name, string message)
        {
            Clients.All.broadcastMessage(name, message);
        }

        public void SendToSpecific(string name, string message, string to)
        {
            Clients.Caller.broadcastMessage(name, message);
            Clients.Client(dic[to]).broadcastMessage(name, message);
        }

        public void Notify(string name, string id)
        {
            if (dic.ContainsKey(name))
            {
                Clients.Caller.differentName();
            }
            else
            {
                dic.TryAdd(name, id);
                foreach (KeyValuePair<String, String> entry in dic)
                {
                    Clients.Caller.online(entry.Key);
                }
                Clients.Others.enters(name);
            }
        }

        public override Task OnDisconnected(bool stopCalled)
        {
            var name = dic.FirstOrDefault(x => x.Value == Context.ConnectionId.ToString());
            string s;
            dic.TryRemove(name.Key, out s);
            return Clients.All.disconnected(name.Key);
        }  
    }
}

它运行良好，但问题是它只能在其他聊天者之间传递正确的用户名和消息，如果我使用用户的头像网址，那么只有我们无法获得正确的头像。所以我的问题是如何使用ConcurrentDictionary传递一个密钥（avatar＆＃39; url），而不是只传递一个Tkey和一个TValue。 请看我的照片：

  

聊天用户界面1

  

聊天UI2

您可以看到我的聊天应用可以传递正确的消息，但它显示错误的头像。请帮忙！

这是剧本：

<script type="text/javascript">

    $(function() {
        startChatHub();
    });
    var nickname = "";
    var avatarurl = "";

    function startChatHub() {
        var chat = $.connection.chatHub;

        // Get the user name.
        nickname = "<%= userName %>";
        avatarurl = "<%= userImage %>";

        chat.client.online = function(name) {
            // Update list of users  
            if (name == nickname) {
                $("#chat_body").append("<img src=" + avatarurl + " class=\"avatar\" /><div id=\"userlist\">" + name + "</div>");
                $("#msg_head").append("<div id=userchat>" + name + "</div>");

            } else {
                $("#chat_body").append("<img src=" + avatarurl + " class=\"avatar\" /><div id=\"userlist\">" + name + "</div>");
                $("#users").append("<option value=\"" + name + "\">" + name + "</option>");
            }
        };
        chat.client.enters = function(name) {
            $("#msg_body").append("<div ><i>" + name + " joins the conversation</i></div>");
            $("#users").append("<option value=\"" + name + "\">" + name + "</option>");
            //$("#chat_body").append("<div id=userlist>" + name + "</div>");
            $("#chat_body").append("<img src=" + avatarurl + " class=\"avatar\" /><div id=\"userlist\">" + name + "</div>");
        };
        // Create a function that the hub can call to broadcast chat messages.  
        chat.client.broadcastMessage = function(name, message) {
            //Interpret smileys  
            message = message.replace(":)", "<img src=\"/ChatJS/Images/Emoticons/smile-2.png\" class=\"smileys\" />");
            message = message.replace(":D", "<img src=\"/ChatJS/Images/Emoticons/smile-1.png\" />");
            message = message.replace(":o", "<img src=\"/ChatJS/Images/Emoticons/smile-6.png\" />");

            //display the message  
            //$("#msg_body").append("<div class=\"border\"><span style=\"color:orange\">" + name + "</span>: " + message + "</div>");
            $("#msg_body").append("<img src=" + avatarurl + " class=\"avatar\" />", message);
        };

        chat.client.disconnected = function(name) {
            //Calls when someone leaves the page  
            $("#msg_body").append("<div ><i>" + name + " leaves the conversation</i></div>");
            $("#chat_body div").remove(":contains('" + name + "')");
            jQuery(this).attr("src", "data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==");
            $("#users option").remove(":contains('" + name + "')");
        };
        //scroll bar
        $(".chat_head").click(function() {
            $("#chat_body").slideToggle("slow");
        });
        $("#msg_head").click(function() {
            $(".msg_wrap").slideToggle("slow");
        });

        $(".close").click(function() {
            $(".msg_box").hide();
        });

        $("#userlist").click(function() {

            $(".msg_wrap").show();
            $(".msg_box").show();
        });

        // Start the connection.  
        $.connection.hub.start().done(function() {
            //Calls the notify method of the server  
            chat.server.notify(nickname, $.connection.hub.id);
            $("#messagebox").keypress(function(e) {
                if (e.keyCode == 13) {
                    var msg = "<div id=msg_b>" + $("#messagebox").val() + "</div>";
                    $("#messagebox").val("");
                    if ($("#users").val() == "All") {
                        //Call the Send method on the hub.  
                        chat.server.send(nickname, msg);
                        $("#msg_body").scrollTop($("#msg_body")[0].scrollHeight);
                    } else {
                        chat.server.sendToSpecific(nickname, msg, $("#users").val());
                        //Clear text box and reset focus for next comment.   
                        $("#messagebox").val("").focus();
                        $("#msg_body").scrollTop($("#msg_body")[0].scrollHeight);
                    }
                }
            });
        });
    }
</script>