Signalr là gì

Bài viết này hướng dẫn hầu hết bước cơ bạn dạng xây đắp một vận dụng real-time sử dụng SignalR. quý khách hàng học tập làm cho nắm làm sao để:

Tạo một project web.Thêm tlỗi viện SignalR client.Tạo một SignalR hub.Cấu hình project nhằm sử dụng SignalR.Thêm code gửi message tự bất kỳ client nào đến tất cả những client đang liên kết.Quý khách hàng sẽ xem: Signalr là gì

Cuối cùng, bạn sẽ bao gồm một vận dụng chat làm việc:

Chuẩn bị môi trường thiên nhiên.NET Core SDK 2.2 hoặc new rộng.Tạo một project webTừ menu, lựa chọn File > New Project.

You watching: Signalr là gì

Quý khách hàng vẫn xem: Signalr là gì


*

Chọn Web Application nhằm tạo project sử dụng Razor Pages.Thêm thư viện SignalR client

Thư viện SignalR VPS được đưa vào vào Microsoft.AspNetChip Core.App metapackage. Tlỗi viện JavaScript client không được tự động hóa thêm vào vào project. Trong lý giải này, các bạn áp dụng Library Manager (LibMan) nhằm nhận thỏng viện client từ bỏ ubpkg. unpkg là một trong những nội dung delivery network (CDN) cái nhưng có thể xây dừng bất kỳ đồ vật gi được tìm thấy vào npm (Node.js packge manager).

Trong Solution Explorer, right-clichồng project, cùng chọn Add > Client-Side Library.Trong cửa sổ Add Client-Side Library , mục Provider lựa chọn unpkg.Về Library, gõ aspnet/signalr1, với lựa chọn version tiên tiến nhất không phải phiên bạn dạng pReview.


*

Chọn Choose specific files, msống tlỗi mục dist/browser , và lựa chọn signalr.js & signalr.min.js.Thiết lập Target Location cho tới wwwroot/lib/signalr/, cùng chinj Install.

See more: Ards Là Gì ? Phác Đồ Điều Trị Suy Hô Hấp Cấp


*

Tạo một SignalR hubTrong tlỗi mục project SignalRChat, chế tạo ra một tlỗi mục Hubs.Trong tlỗi mục Hubs, sản xuất một tệp tin ChatHub.cs cùng với code bên dưới:

using Microsoft.AspNetbộ vi xử lý Core.SignalR;using System.Threading.Tasks;namespace SignalRChat.Hubs public class ChatHub : Hub public async Task SendMessage(string user, string message) await Clients.All.SendAsync("ReceiveMessage", user, message); Class ChatHub thừa kế trường đoản cú class SignalR Hub. Class Hub thống trị những kết nối, nhóm cùng message.Phương thơm thức SendMesssage có thể được hotline vì chưng một client sẽ kết nối nhằm gửi một message mang đến tất cả các clients. Code JavaScript hotline cách tiến hành được đã cho thấy ngơi nghỉ bước sau vào bài bác trả lời này. Code SignalR là bất đồng bộ nhằm cung ứng về tối ta kĩ năng không ngừng mở rộng.

Cấu hình SignalR

SignalR hệ thống đề xuất được cấu hình để trải qua SignalR request cho SignalR.

Thêm code được đánh dấu trông rất nổi bật dưới tới file ```StartUp.cs

using Microsoft.AspNetCore.Builder;using Microsoft.AspNetVi xử lý Core.Hosting;using Microsoft.AspNetChip Core.Http;using Microsoft.AspNetChip Core.Mvc;using Microsoft.Extensions.Configuration;using Microsoft.Extensions.DependencyInjection;using SignalRChat.Hubs;namespace SignalRChat public class Startup public Startup(IConfiguration configuration) Configuration = configuration; public IConfiguration Configuration get; // This method gets called by the runtime. Use this method to lớn add services khổng lồ the container. public void ConfigureServices(IServiceCollection services) services.Configure(options => // This lambdomain authority determines whether user consent for non-essential cookies is needed for a given request. options.CheckConsentNeeded = context => true; options.MinimumSameSitePolicy = SameSiteMode.None; ); services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_1); services.AddSignalR(); // This method gets called by the runtime. Use this method to lớn configure the HTTP.. request pipeline. public void Configure(IApplicationBuilder phầm mềm, IHostingEnvironment env) if (env.IsDevelopment()) tiện ích.UseDeveloperExceptionPage(); else phầm mềm.UseExceptionHandler("/Error"); tiện ích.UseHsts(); phầm mềm.UseHttpsRedirection(); tiện ích.UseStaticFiles(); tiện ích.UseCookiePolicy(); tiện ích.UseSignalR(routes => routes.MapHub("/chatHub"); ); app.UseMvc(); Những chuyển đổi này thêm SignalR tới hệ thống ASPhường.NET Chip Core depandency Injection cùng middleware pipeline.

See more: Build Up Là Gì - Và Cấu Trúc Cụm Từ Build Up Trong Câu Tiếng Anh

Thêm SignalR client code

Ttuyệt cầm cố câu chữ vào Pages/Index.cshtml cùng với code mặt dưới:

Giải phù hợp code bên trên:

Tạo những textbox đến name cùng message cùng với button submit

Thêm file script tsi chiếu mang đến SignalR cùng code áp dụng chat chat.js mẫu nhưng mà họ tạo nên ngơi nghỉ bước tiếp theo

Trong thỏng mục wwwroot/js, tạo nên một tệp tin chat.js với code bên dưới:

"use strict";var connection = new signalR.HubConnectionBuilder().withUrl("/chatHub").build();//Disable send button until connection is establisheddocument.getElementById("sendButton").disabled = true;connection.on("ReceiveMessage", function (user, message) var msg = message.replace(/&/g, "&").replace(//g, ">"); var encodedMsg = user + " says " + msg; var li = document.createElement("li"); li.textContent = encodedMsg; document.getElementById("messagesList").appendChild(li););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()); ); sự kiện.preventDefault(););Giải phù hợp một chút ít về code trên:

Ngay chớp nhoáng tên và message đồng thời hiện thị lên nghỉ ngơi cả 2 trình duyệt

Tổng kết

Đây là phía dẫn cơ bạn dạng dành cho chúng ta mới bất đầu cùng với SignalR, mà lại sẽ tất cả kiến thức về ASPhường.NET core. Các bước triển khai hơi đơn giản cùng dễ dàng nắm bắt đúng không các bạn. Hy vọng nội dung bài viết mang về cho các bạn hầu hết điều hữu ích.

Bài viết được dịch từ bỏ nguồn Tutorial: Get started with ASP.NET Vi xử lý Core SignalR

Code ví dụ trường đoản cú Microsoft: https://github.com/aspnet/Docs/tree/master/aspnetcore/tutorials/signalr/sample


Chuyên mục: Giải Đáp