标签: blazor-server-side

如何使用区域在剃刀组件库中使用 blazor 服务器端?

我有一个现有的.net core 3.0 preview 7 web 应用程序。我的应用程序主要是组织成区域的剃刀页面,例如。Admin、Sales 等。如果我将blazor组件放在应用程序的根目录下,我可以成功使用它,但是,如果我将组件移动到 RCL,我可以访问该组件但它没有响应(单击按钮对于计数器示例不增加计数)。

我希望能够去localhost/Admin/RazorPageContainingBlazorComponentlocalhost/Sales/AnotherRazorPageContainingBlazorComponent

我在 Chrome 开发工具中收到此错误:''' 错误:无法完成与服务器的协商:错误

https://localhost:5000/myfeature/_blazor/negotiate 404 '''

我相信这是由将 signalR 集线器映射到https://localhost:5000/ 引起的,但我不确定如何添加额外的 blazor 集线器映射或如何更改 blazor.server.js 以使用根集线器。

.net asp.net-core blazor blazor-server-side

9
推荐指数
2
解决办法
2454
查看次数

Blazor:从布局访问参数

如何从布局访问页面的路由参数?

我有一个接受路由参数的页面,如下所示:

@page /my-page/{Slug}
Run Code Online (Sandbox Code Playgroud)

我需要访问Slug在共享布局中呈现标记时的值。

我尝试OnParametersSet在布局文件中实现如下所示,但未设置该值。它仅在页面级别分配。

@inherits LayoutComponentBase

<div class="sidebar">
    <NavMenu />
</div>

<div class="main">
    <div class="top-row px-4">
            @this.Slug   <<<<------ display the parameter
    </div>

    <div class="content px-4">
        @Body
    </div>
</div>

@code
{
    [Parameter]
    public string Slug { get; set; }

    protected override void OnParametersSet()
    {
        // Slug is always null :-/
    }
}
Run Code Online (Sandbox Code Playgroud)

blazor blazor-server-side

9
推荐指数
2
解决办法
4873
查看次数

Blazor:在上一个操作完成之前,在此上下文中启动了第二个操作

我正在创建一个服务器端 Blazor 应用程序。以下代码位于Startup.cs.

services.AddDbContext<MyContext>(o => o.UseSqlServer(Configuration.GetConnectionString("MyContext")), ServiceLifetime.Transient);
services.AddTransient<MyViewModel, MyViewModel>();
Run Code Online (Sandbox Code Playgroud)

在 ViewModel 中:

public class MyViewModel : INotifyPropertyChanged
{
    public MyViewModel(MyContext myContext)
    {
        _myContext = myContext;
    }

    public async Task<IEnumerable<Dto>> GetList(string s)
    {
        return await _myContext.Table1.where(....)....ToListAsync();
    }
Run Code Online (Sandbox Code Playgroud)

并在剃刀文件中。

@inject ViewModels.MyViewModel VM
<input id="search" type="text" @bind="search" />
<input id="search" type="button" value="Go" @onclick="SearchChanged" />   
@code {
    string search = "";
    int currentCount = 0;
    async void SearchChanged() {
        currentCount++;
        dtos = GetList(search);
    }
}
Run Code Online (Sandbox Code Playgroud)

但是,有时单击搜索按钮时会出现以下错误?

System.InvalidOperationException: '在上一个操作完成之前,在此上下文中启动了第二个操作。这通常是由使用相同 DbContext 实例的不同线程引起的。有关如何避免 DbContext 线程问题的详细信息,请参阅 …

c# entity-framework entity-framework-core blazor blazor-server-side

9
推荐指数
1
解决办法
4295
查看次数

MVC 中的 Blazor:组件被渲染,但 @onclick 不起作用。连接问题

我正在尝试在 .net core 3 MVC 项目中使用 Blazor。我使用了一些教程来做到这一点,比如https://fizzylogic.nl/2019/08/18/integrating-blazor-in-an-existing-asp-net-core-application/https://chrissinty.com /using-blazor-components-in-an-existing-mvc-application/

工作原理:Blazor 组件的初始化工作正常。OnInitializedAsync() 函数被触发,组件渲染得很好。

这是来自 MVC 视图的调用:

@(await Html.RenderComponentAsync<MyProject.Components.Locations>(RenderMode.ServerPrerendered))
Run Code Online (Sandbox Code Playgroud)

什么不起作用:在 Blazor 组件中使用 @onclick。这是一些示例代码:

<span @onclick="AddLocation"></span>

@code {
    private void AddLocation(){

    }
}
Run Code Online (Sandbox Code Playgroud)

它可能不起作用的原因是我在连接初始化时出错。组件不是从基本路径渲染的,而是从特定视图的 url 渲染的,我认为这会影响连接。我在 Chrome 的控制台中收到这些错误:

  • [2019-12-02T09:26:08.117Z] 信息:将“_blazor”规范化为“ https://localhost:44375/Locations/_blazor ”。_blazor/negotiate:1 加载资源失败:服务器响应状态为 404 () blazor.server.js:1
  • [2019-12-02T09:26:08.155Z] 错误:无法完成与服务器的协商:错误 e.log @ blazor.server.js:1 blazor.server.js:1
  • [2019-12-02T09:26:08.156Z] 错误:无法启动连接:错误 e.log @ blazor.server.js:1 blazor.server.js:15
  • [2019-12-02T09:26:08.156Z] 错误:错误 e.log @ blazor.server.js:15 blazor.server.js:1 -Uncaught (in promise) 错误:如果连接不在,则无法发送数据“连接”状态。

主要的错误可能是'将'_blazor '标准化为' https://localhost:44375/Locations/_blazor ' '。从基本路径请求 _blazor 有效。有谁知道在这种情况下如何设置基本路径?

(是的,普通 Razor 页面环境中的 …

c# asp.net-mvc blazor blazor-server-side

9
推荐指数
1
解决办法
3812
查看次数

Blazor 导航:在不更改重新加载页面的情况下更新 URL

我在我的应用程序中使用 URL 参数作为页面状态。

如何在不实际导航的情况下更改 URL?

谢谢!

(使用 blazor 服务器端)

c# blazor blazor-server-side

9
推荐指数
2
解决办法
2523
查看次数

.NET Core 3.1 Web API 和 Blazor 服务器端 JWT 身份验证

我想了解,如何为Blazor 服务器端应用程序设置JWT 身份验证

让我举一个例子:假设我们有一个 .NET Core 3.1 Web API 项目。该项目有自己的TokenController实现,它为有效的用户/密码组合提供 JWT。所有其他控制器对每个请求都需要这样的令牌。

验证身份验证的中间件配置如下:

// enabling JWT bearer scheme
services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
    .AddJwtBearer(options => 
    {
        options.TokenValidationParameters = new TokenValidationParameters 
        {
            // TOKEN VALIDATION PARAMETERS
        };
    });

// applying default authentication policy
services.AddMvc(o => 
{
    o.EnableEndpointRouting = false;
    var policy = new AuthorizationPolicyBuilder()
        .RequireAuthenticatedUser()
        .Build();
    o.Filters.Add(new AuthorizeFilter(policy));
}).SetCompatibilityVersion(CompatibilityVersion.Version_3_0);
Run Code Online (Sandbox Code Playgroud)

到这里为止,这工作得很好。

现在我想为这个项目添加一个漂亮的 Blazor 服务器端 UI,但我无法思考如何进行身份验证?

根据 Microsoft Docs,服务器端应用程序的身份验证应该在建立 SignalR 连接时进行:

Blazor 服务器身份验证

Blazor 服务器应用通过使用 SignalR 创建的实时连接运行。在建立连接时处理基于 SignalR 的应用程序中的身份验证。身份验证可以基于 cookie或其他一些不记名令牌。

(来源: …

.net jwt .net-core jwt-auth blazor-server-side

9
推荐指数
1
解决办法
4996
查看次数

当 ASPNETCORE_ENVIRONMENT 更改为除“开发”之外的任何内容时 - Blazor 应用程序在 VS 中调试时看不到来自 razor 类库的资源

也许只是尝试一下这个例子:

https://github.com/HTD/BlazorProfiles

这是一个演示 Blazor 应用程序(默认)。我创建了 2 个自定义应用程序配置文件:开发和生产。只需在 Visual Studio 中按 F5 键即可调试两者。

然后我创建了一个虚拟 Razor 组件库并将其命名为 RCL。我将其作为主项目的依赖项。在我的虚拟 RCL 中,wwwroot我在目录中添加了extra.css文件。该文件的作用是将背景颜色更改为浅绿色。如果发生这种情况 - 则意味着文件已被加载。如果背景保持灰色/白色,则不会加载。

这是_Host.cshtml加载 CSS 的片段:

<link href="_content/RCL/extra.css" rel="stylesheet" />
Run Code Online (Sandbox Code Playgroud)

尝试运行它。有用。但是,有一个条件: ASPNETCORE_ENVIRONMENT环境变量必须设置为“Development”。

如果您测试Production配置文件(或将环境变量更改为“Production”),然后运行应用程序 - 该extra.css文件将不会被加载。

在此输入图像描述

背景没有变成绿色,所以有问题。为什么会发生这种情况?这是 Visual Studio 中的错误吗?

如果您想知道为什么我需要设置此环境变量:它允许加载额外的

appsettings.[ASPNETCORE_ENVIRONMENT].json

文件。所以我可以为我的应用程序设置不同的配置。我需要使用不同的配置测试我的应用程序。现在我只能在 Visual Studio 中使用“开发”配置来调试它。当我将配置更改为其他任何内容时,我无法运行我的应用程序,因为它无法从库中加载组件所需的必要 JavaScript 文件。

因此,预期的行为:无论我在“ASPNETCORE_ENVIRONMENT”中放入什么 - 来自 RCL 的文件应该始终加载。为什么他们不应该呢?

实际行为:使用不同的配置(配置文件)会中断 Razor 组件库加载。

blazor blazor-server-side

9
推荐指数
2
解决办法
1938
查看次数

Blazor 连接已断开

我有一个 Web 应用程序,其客户端在 Blazor 服务器上运行。我已设置自定义 Blazor 重新连接模式 ( <div id="components-reconnect-modal"...),如文档所述 - Microsoft Docs

我还对 SignalR 和 Blazor 电路进行了这些设置:

    services.AddServerSideBlazor
        (options =>
        {
            options.DisconnectedCircuitMaxRetained = 100;
            options.DisconnectedCircuitRetentionPeriod = TimeSpan.FromMinutes(5);
            options.JSInteropDefaultCallTimeout = TimeSpan.FromMinutes(1);
            options.MaxBufferedUnacknowledgedRenderBatches = 10;
        })
        .AddHubOptions(options =>
        {
            options.ClientTimeoutInterval = TimeSpan.FromSeconds(30);
            options.EnableDetailedErrors = false;
            options.HandshakeTimeout = TimeSpan.FromSeconds(15);
            options.KeepAliveInterval = TimeSpan.FromSeconds(15);
            options.MaximumReceiveMessageSize = 32 * 1024;
            options.StreamBufferCapacity = 10;
        });
Run Code Online (Sandbox Code Playgroud)

但我有一个恼人的问题 - 每当应用程序在浏览器选项卡中打开并保持静止而没有人使用它时,它就会断开连接。它的发生非常不一致,我无法找到这些自定义时间段的配置,但我需要放大它们。例子:

  1. 最初于上午 11:34:24 加载应用程序
  2. 保持这样一段时间
  3. 在控制台中:“信息:连接已断开。” 上午 11:55:48,我的重新连接模式出现。

如何延长连接的生命周期,使其始终大于会话超时。我检查了我的应用程序池的私人内存限制,但它是无限的。它的发生确实与重现的相同步骤不一致。测试 1 - 16 分 20 秒;测试 2 - 21 …

signalr .net-core blazor blazor-server-side

9
推荐指数
1
解决办法
6728
查看次数

从任意线程调用StateHasChanged()是否安全?

StateHasChanged()从任意线程调用安全吗?

让我给你一些背景。想象一下您拥有的服务器端Blazor / Razor组件应用程序:

  • 单例服务NewsProvider,它BreakingNews从任意线程引发事件。
  • 一个组件News.cshtml是可以获得的服务注入和订阅BreakingNews事件。引发事件时,组件将更新模型并调用StateHashChanged()

NewsProvider.cs

using System;
using System.Threading;

namespace BlazorServer.App
{
    public class BreakingNewsEventArgs: EventArgs
    {
        public readonly string News;

        public BreakingNewsEventArgs(string news)
        {
            this.News = news;
        }
    }

    public interface INewsProvider
    {
        event EventHandler<BreakingNewsEventArgs> BreakingNews;
    }

    public class NewsProvider : INewsProvider, IDisposable
    {

        private int n = 0;

        public event EventHandler<BreakingNewsEventArgs> BreakingNews;
        private Timer timer;

        public NewsProvider()
        {
            timer = new Timer(BroadCastBreakingNews, null, 10, 2000);

        } …
Run Code Online (Sandbox Code Playgroud)

c# blazor blazor-server-side

8
推荐指数
1
解决办法
2343
查看次数

Blazor 服务器页面的参数在手动刷新时抛出“404 not found”

我有一个 Blazor 服务器应用程序,其中一个页面接受 uri 中的参数。当我单击具有路由设置的锚标记以使用参数(如下所示)访问该页面时,链接工作正常,并且页面加载。

<a href="/MyPage/{@Param1}/{@Param2}"> <!--link content in here--> </a>
Run Code Online (Sandbox Code Playgroud)

但是,如果尝试直接从该 URL 访问该页面,或者在浏览器中手动刷新,则该页面不会重新初始化或命中参数上的任何断点。相反,它会抛出 404 not found。

所以这里有两件事:

  • 首先,我很困惑为什么它在锚标记内工作正常,但以其他方式消失。特别是当指令中没有参数的页面@page可以与刷新/直接网址一起正常工作时。
  • 其次,这是 Blazor Server 的预期行为还是我在这里遗漏了一些直接破坏页面刷新/点击 URL 的内容?看起来不像是一个功能,但也许我误解了 Blazor 的路由。

相关页面的 Razor 和 Razor.cs:

@page "/MyPage/{Param1}/{Param2}"

<h1>MyPage</h1>

<Metrics Param1="@Param1" />

<Details Param1="@Param1" Param2="@Param2" />

<InProgress Param1="@Param1" Param2="@Param2" />

<InQueue Param1="@Param1" />

<br />
Run Code Online (Sandbox Code Playgroud)
using System;
using System.Linq;
using System.Threading.Tasks;
using System.Collections.Generic;
using Microsoft.AspNetCore.Components;
using MyApp.Data.Models.ApiResponse;

namespace MyApp.Pages
{
    public partial class MyPage
    {
        [Parameter]
        public string Param1 { get; set; …
Run Code Online (Sandbox Code Playgroud)

c# page-refresh blazor blazor-server-side

8
推荐指数
1
解决办法
2954
查看次数