signalr实现简单的发送信息

1.后台代码:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Microsoft.AspNet.SignalR;

namespace Signalr
{
    public class MsgHub : Hub
    {
        public void SenMsg(string  Username,string  txt)
        {
            Clients.All.getMsg(Username,txt);
        }
    }
}
using Owin;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace Signalr
{
    public class Startup
    {
        public  void Configuration(IAppBuilder  app)
        {

            app.MapSignalR();

        }

    }
}

前台代码:
@{
ViewBag.Title = “About”;
}

<script src="~/Scripts/jquery-3.3.1.js"></script>

<script src="~/Scripts/jquery.signalR-2.2.2.js"></script>

<script src="/signalr/hubs"></script>
<script>
  var    Msghub=$.connection.msgHub;
      Msghub.client.getMsg=function(Username,content){

          var  txtTemplate='';
     txtTemplate+='<div>';
        txtTemplate+='<span>{{name}}</span>: ';
        txtTemplate+='<span>{{content}}</span>';
    txtTemplate+='</div>';

   var  html=txtTemplate.replace('{{name}}',Username).replace('{{content}}',content);
    $("#MsgList").prepend(html);
      }
    $.connection.hub.start().done(function(){

      $("#Login").click(function(){
        
      if($("#txtName").val().length>1)
        {
         
         sessionStorage.setItem("uesr",$("#txtName").val());
    
        }else{
    
       alert("登录失败!");
      return;
     } 
      });
      $("#sendBtn").removeAttr("disabled").click(function(){

       Msghub.server.senMsg(sessionStorage.getItem("uesr"),$("#txtMsg").val());

      }) 
    }).fail(function(){



    });


</script>
<div id="MsgList">

</div>
<input type="text" id="txtName" />
<button id="Login">登录</button>
<input type="text" id="txtMsg" />
<button id="sendBtn" disabled="disabled">发送消息</button>

实现效果:
在这里插入图片描述

发布了61 篇原创文章 · 获赞 0 · 访问量 615
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 数字20 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览