Signar即时通讯的简单应用

2022-07-10 23:35:44 阅读：248 来源： 互联网

标签：function connection 即时通讯 getElementById Signar user 应用 message document

实时 Web 功能使服务器端代码能够将内容推送到客户端。实现简单聊天功能

1、创建Razor模板应用

2、创建Signar客户端

3、创建signar中心：用作客户端和服务端通信的高级管道

 1 using Microsoft.AspNetCore.SignalR;
 2 
 3 namespace SignalRChat.Hubs
 4 {
 5     public class ChatHub : Hub
 6     {
 7         public async Task SendMessage(string user, string message)
 8         {
 9             await Clients.All.SendAsync("ReceiveMessage", user, message);
10         }
11     }
12 }

可通过已连接客户端调用 SendMessage，以向所有客户端发送消息

4、配置Signar

using SignalRChat.Hubs;

builder.Services.AddSignalR();

app.MapHub<ChatHub>("/chatHub");

将 SignalR 添加到 ASP.NET Core 依赖关系注入和路由系统

5、创建chat.j文件

"use strict";

//创建连接
var connection = new signalR.HubConnectionBuilder().withUrl("/chatHub").build();

//Disable the send button until connection is established.   

//禁用
document.getElementById("sendButton").disabled = true;

//接受消息
connection.on("ReceiveMessage", function (user, message) {
    var li = document.createElement("li");
    document.getElementById("messagesList").appendChild(li);
    // We can assign user-supplied strings to an element's textContent because it
    // is not interpreted as markup. If you're assigning in any other way, you 
    // should be aware of possible script injection concerns.
    li.textContent = `${user} says ${message}`;
});

//发送消息
connection.start().then(function () { 

//启用
    document.getElementById("sendButton").disabled = false;
}).catch(function (err) {
    return console.error(err.toString());
});

document.getElementById("sendButton").addEventListener("click", function (event) {
    var user = document.getElementById("userInput").value;
    var message = document.getElementById("messageInput").value;
    connection.invoke("SendMessage", user, message).catch(function (err) {
        return console.error(err.toString());
    });
    event.preventDefault();
});

6.效果

标签：function,connection,即时通讯,getElementById,Signar,user,应用,message,document
来源： https://www.cnblogs.com/Join-Lzy-666/p/16464380.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

Signar即时通讯的简单应用