SignalR 자체 호스트 다중 터미널 메시지 푸시 서비스 소개-파이썬 튜토리얼-php.cn

SignalR 자체 호스트 다중 터미널 메시지 푸시 서비스 소개

零下一度

풀어 주다： 2017-07-02 10:53:59

원래의

1592명이 탐색했습니다.

이 글은 SignalR Self Host+MVC 등 멀티 터미널 메시지 푸시 서비스의 세 번째 글을 중심으로 소개하고 있으니 관심 있는 분들은 참고하시기 바랍니다.

1. 개요

최근입니다. 프로젝트 때문에 너무 바쁘고, 몸도 좀 불편해요. 어젯밤에 잠을 잘 못 잤고, 시간도 별로 없었어요. 오늘은 친구가 웹에 언제 메시지를 보낼 수 있는지 물었습니다. 기사를 작성할 때에도 나는 점심 시간과 점심 시간을 이용하여 기사를 빠르게 보충했습니다. 나는 빚을 졌다.

이 장은 주로 MVC의 웹 측에서 제어 측으로 정보를 보내는 다중 터미널 메시지 통신을 구현하는 간단한 데모입니다.

2. 웹 클라이언트 만들기

1. 새로운 WebClient 솔루션 만들기

2. WebClient 솔루션 아래에 새로운 Clinet mvc 프로젝트를 만듭니다.3. 해당 프로젝트 템플릿을 보려면 여기에서 인터넷 애플리케이션

4을 선택하세요. vs에서 패키지 관리자 콘솔을 확인하고 다음 코드를 입력하세요.

Install-Package Microsoft.AspNet.SignalR.JS

로그인 후 복사

5. Homge 폴더에 있는 Index.cshtml 파일 코드는 다음과 같습니다

@{
  Layout = null;
}

<h1>流程演示</h1>
<input type="hidden" id="displayname" />
<h2 id="thisname"></h2>

<select id="username" style="width: 100px;">
</select>
<br />
<br />
<input type="text" id="message" />
<input id="send" type="button" value="发送" />
<p>
  <h1 id="messgaeInfo"></h1>
</p>
<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script src="~/Scripts/jquery.signalR-2.2.1.min.js"></script>
<script src="http://localhost:10086/signalr/hubs"></script>
<script type="text/javascript">
  $(function () {
    $.connection.hub.url = &#39;http://localhost:10086/signalr&#39;;
    var work = $.connection.IMHub;
  
    $(&#39;#displayname&#39;).val(prompt(&#39;请输入昵称:&#39;, &#39;&#39;));
    $(&#39;#thisname&#39;).text(&#39;当前用户：&#39; + $(&#39;#displayname&#39;).val());
    var fromUser = $(&#39;#displayname&#39;).val();

    //对应后端的SendMessage函数，消息接收函数
    work.client.receivePrivateMessage = function (user, message) {
      //alert(message);
      $(&#39;#messgaeInfo&#39;).append(message + &#39;</br>&#39;);
    };

    //后端SendLogin调用后，产生的loginUser回调
    work.client.onConnected = function (connnectId, userName, OnlineUsers) {
      reloadUser(OnlineUsers);
    };

    //hub连接开启
    $.connection.hub.start().done(function () {
      var username = $(&#39;#displayname&#39;).val();
      //发送上线信息
      work.server.register(username);

      //点击按钮，发送消息
      $(&#39;#send&#39;).click(function () {
        var friend = $(&#39;#username&#39;).val();
        //调用后端函数，发送指定消息
        work.server.sendPrivateMessage(friend, $("#message").val());
      });
    });
  });

  //重新加载用户列表
  var reloadUser = function (userlist) {
    $("#username").empty();
    for (i = 0; i < userlist.length; i++) {
      $("#username").append("<option value=" + userlist[i].UserName + ">" + userlist[i].UserName + "</option>");
    }
  }
</script>

로그인 후 복사

6. 먼저 이전 두 장의 서브 콘솔 프로젝트를 실행한 후 F5를 눌러 웹을 실행합니다. 클라이언트 프로젝트는 다음 인터페이스를 참조하세요. 사용자 이름 a

User login

7을 입력하세요. 그런 다음 위 단계와 같이 다른 브라우저를 열고 b 사용자 로그인을 입력하세요. 사용자 a는 드롭에서 b를 선택합니다. -다운 항목(드롭다운 옵션은 사용자가 로그인할 때 자동으로 새 사용자를 추가합니다.) 사용자 b가 테스트를 위해 서로에게 메시지를 보냅니다. a와 b 간의 메시지 전송에 문제가 있습니다. 이때 웹 측 메시지 전송이 성공했음을 증명하십시오. 이때 이전 장의 클라이언트 콘솔 프로젝트를 열고 프로젝트 아래의 bin에서 Clinet.exe를 실행한 후 두 프로그램을 확인하십시오. , 로그인 이름 c를 입력하고 b