网站后台网址在哪输入,营销型网站建设式球磨机,织梦网站每天被挂马,拍卖网站开发原文链接#xff1a;https://blazor-university.com/dependency-injection/dependency-lifetimes-and-scopes/singleton-dependencies/Singleton 依赖Singleton 依赖是一个由依赖它的每个对象共享的单个对象实例。在 WebAssembly 应用程序中#xff0c;这是在浏览器的当前选项…原文链接https://blazor-university.com/dependency-injection/dependency-lifetimes-and-scopes/singleton-dependencies/Singleton 依赖Singleton 依赖是一个由依赖它的每个对象共享的单个对象实例。在 WebAssembly 应用程序中这是在浏览器的当前选项卡中运行的当前应用程序的生命周期。当类没有状态或在服务器端应用程序中具有可以在连接到同一服务器的所有用户之间共享的状态时将依赖项注册为 Singleton 是可以接受的Singleton 依赖项必须是线程安全的。为了说明这种共享状态让我们创建一个非常简单即不可扩展的聊天应用程序。Singleton 聊天服务源代码[1]首先创建一个新的 Blazor 服务器应用。然后新建一个名为 Services 的文件夹添加如下界面。这是我们的 UI 将用来向其他用户发送消息的服务每当用户发送消息时都会收到通知并且当我们的用户首次连接时他们将能够看到迄今为止有限的聊天历史记录。因为这是在 Blazor 服务器端应用程序上运行的 Singleton 依赖项所以它将由同一服务器上的所有用户共享。public interface IChatService
{bool SendMessage(string username, string message);string ChatWindowText { get; }event EventHandler TextAdded;
}为了实现这项服务我们将使用 Liststring 来存储聊天历史记录并在队列中超过 50 条时从列表的开头删除消息。我们将使用 lock() 语句来确保线程安全。public class ChatService : IChatService
{public event EventHandler TextAdded;public string ChatWindowText { get; private set; }private readonly object SyncRoot new object();private Liststring ChatHistory new Liststring();public bool SendMessage(string username, string message){if (string.IsNullOrWhiteSpace(username) || string.IsNullOrWhiteSpace(message))return false;string line ${username} {message};lock (SyncRoot){ChatHistory.Add(line);while (ChatHistory.Count 50)ChatHistory.RemoveAt(0);ChatWindowText string.Join(\r\n, ChatHistory.Take(50));}TextAdded?.Invoke(this, EventArgs.Empty);return true;}
}第 3 行每当有新消息发布到我们的聊天服务器时我们的 UI 可以挂钩的事件。第 4 行代表最多 50 行聊天记录的字符串。第 16-23 行锁定 SyncRoot 以防止并发问题将当前行添加到聊天历史记录如果超过 50 行则删除最旧的历史记录然后重新创建 ChatWindowText 属性的内容。第 25 行通知聊天服务的所有使用者 ChatWindowText 已更新。要注册服务请打开 Startup.cs 并在 ConfigureServices 中添加以下内容services.AddSingletonIChatService, ChatService();定义用户界面为了将 C# 聊天代码与显示标记分开我们将使用代码隐藏方法。在 Pages 文件夹中创建一个名为 Index.razor.cs 的新文件Visual Studio 应自动将其嵌入到 Index.Razor 文件下方。然后我们需要将我们的新索引类标记为部分。public partial class Index
{
}那么需要我们的组件类来做以下事情初始化后订阅 ChatService.TextAdded。为了避免我们的 Singleton 持有已处置对象的引用当我们的组件被处置时我们应该取消订阅 ChatService.TextAdded。当 ChatService.TextAdded 被触发时我们应该更新用户界面以显示新的 IChatService.ChatWindowText 内容。我们应该允许用户输入他们的名字一些文本发送给其他用户。让我们从最简单的步骤开始也就是第 4 步然后按照列出的顺序实现其他要求。为简单起见我们将向当前类添加 Name 和 Text 属性而不是创建视图模型我们还将使用 RequiredAttribute 装饰它们以便在用户尝试发布文本而不填写所需输入时向他们提供反馈.public partial class Index
{[Required(ErrorMessage Enter name)]public string Name { get; set; }[Required(ErrorMessage Enter a message)]public string Text { get; set; }
}初始标记和验证我们将替换 Index.razor 的内容并将其替换为一个简单的 EditForm该 EditForm 由一个 DataAnnotationsValidator 组件和一些用于输入用户名和文本的 Bootstrap CSS 修饰的 HTML 组成。page /
h1Blazor web chat/h1EditForm ModelthisDataAnnotationsValidator/div classrow mt-1div classcol-3InputText classform-control placeholderName bind-ValueName maxlength20/ValidationMessage For( () Name )//divdiv classcol-9div classinput-groupInputText classform-control placeholder... bind-ValueText maxlength100 /div classinput-group-appendbutton classbtn btn-primary typesubmitSend/button/div/divValidationMessage For( () Text )//div/div
/EditForm第 4 行创建一个绑定到 this 的 EditForm。第 5 行启用基于数据注释如RequiredAttribute的验证。第 8 行将 Blazor InputText 组件绑定到 Name 属性。第 9 行显示 Name 属性的任何验证错误。第 13 行将 Blazor InputText 组件绑定到 Text 属性。第 18 行显示 Text 属性的任何验证错误。使用 IChatService接下来我们将注入 IChatService 并将其完全连接到我们的组件。为此我们需要执行以下操作。public partial class Index : IDisposable
{[Required(ErrorMessage Enter name)]public string Name { get; set; }[Required(ErrorMessage Enter a message)]public string Text { get; set; }[Inject]private IChatService ChatService { get; set; }private string ChatWindowText ChatService.ChatWindowText;protected override void OnInitialized(){base.OnInitialized();ChatService.TextAdded TextAdded;}private void SendMessage(){if (ChatService.SendMessage(Name, Text))Text ;}private void TextAdded(object sender, EventArgs e){InvokeAsync(StateHasChanged);}void IDisposable.Dispose(){ChatService.TextAdded - TextAdded;}
}第 8-9 行声明应自动注入的对 IChatService 的依赖项。第 11 行声明一个使访问 IChatService.ChatWindowText 变得简单的属性。第 16 行订阅 IChatService.TextAdded 事件。第 21 行将当前用户的输入发送到聊天服务。第 27 行每次调用 IChatService.TextAdded 时刷新用户界面。第 32 行当组件被释放时取消订阅 IChatService.TextAdded 以避免内存泄漏。注意我们必须将 StateHasChanged 调用包装在对 InvokeAsync 的调用中。这是因为 IChatService.TextAdded 事件将由添加文本的任何用户触发因此将由各种线程触发。我们需要 Blazor 使用 InvokeAsync 编组这些调用以确保我们组件上的所有线程调用都按顺序执行。将聊天窗口添加到我们的用户界面我们现在只需要在我们的标记中添加一个 HTML textarea 控件并将它绑定到我们的 ChatWindowText 属性并确保在提交 EditForm 时没有验证错误它会调用我们的 SendMessage 方法。最终的用户界面标记如下所示。page /h1Blazor web chat/h1EditForm Modelthis OnValidSubmitSendMessageDataAnnotationsValidator/div classrowtextarea classform-control rows20 readonlyChatWindowText/textarea/divdiv classrow mt-1div classcol-3InputText classform-control placeholderName bind-ValueName maxlength20/ValidationMessage For( () Name )//divdiv classcol-9div classinput-groupInputText classform-control placeholder... bind-ValueText maxlength100 /div classinput-group-appendbutton classbtn btn-primary typesubmitSend/button/div/divValidationMessage For( () Text )//div/div
/EditForm第 5 行当用户在 InputText 上按 enter 并且输入验证通过时调用 SendMessage。第 7-9 行添加 HTML textarea 并将其绑定到 WindowChatText。WebAssembly 应用程序中的 Singleton 依赖项如果 Blazor 应用程序是 Blazor 服务器端应用程序则上述应用程序将仅允许用户相互聊天。这是因为 Singleton 依赖项是每个应用程序进程共享的。Blazor 服务器端应用程序实际上在服务器上运行因此单例实例在同一服务器应用程序进程中运行的多个用户之间共享。在 WebAssembly 应用程序中运行时每个浏览器选项卡都是它自己独立的应用程序进程因此如果用户在浏览器中运行单独的进程WebAssembly 托管应用程序用户将无法相互聊天因为他们不共享任何公共状态。使用多个服务器时也是如此。一旦我们的聊天服务流行到足以保证一个或多个额外的服务器就不再有所有用户的全局共享状态只有每个服务器的共享状态。一旦我们需要扩展我们的服务器或者我们希望将我们的聊天客户端实现为 WebAssembly 应用程序以从我们的服务器中移除一些工作负载我们就需要设置一种更强大的共享状态的方法。这不在本节的范围内因为本节的目的只是演示注册为单例的依赖项如何在单个应用程序进程中共享。读者任务浏览器不可能有足够的垂直空间同时显示 50 条聊天消息因此用户必须手动滚动聊天区域才能看到最新消息。为了改善用户体验我们的组件应该在每次添加新文本时真正将 textarea 滚动条滚动到底部。如果您不想自己解决这个问题那么只需看看本节随附的项目工作已经为您完成。如果您确实想解决它这里有一些线索。您将编写一些将控件作为参数并设置 control.scrollTop control.scrollHeight 的 JavaScript。每次我们的组件呈现后您都需要调用此 JavaScript[2]。您需要将 textarea 的 ElementReference[3] 传递给 JavaScript。参考资料[1]源代码: https://github.com/mrpmorris/blazor-university/tree/master/src/DependencyInjection/WebChat
