标签: blazor-server-side

我通过新建了服务器端Blazor项目（以前是Razor Components）dotnet new razorcomponents -o MySampleApp。它在我的计算机上按预期工作，当我右键单击并尝试发布到Azure时，它失败并显示一个

http错误503服务不可用。

我通过使用“自包含”部署模式解决了这一问题，它使我进入了预期的Blazor示例主页。天气预报页面可以使用，但是计数器页面无法增加。我怎样才能解决这个问题？

从开发人员的角度（而不是从架构角度），我在开发 Asp.net MVC 和服务器端 Blazor 应用程序之间似乎没有太大区别。

事实上，服务器端 Blazor 感觉几乎与 MVC 相同，但不包括您可以在 blazor 视图/页面中进行的一些方便的数据绑定。

是否存在我可能没有意识到的重大差异？同样，纯粹从开发人员的角度来看，而不是从底层技术的角度来看。

我在同一解决方案中有一个完全可操作的Blazor服务器端项目和一个.NET Core 3 MVC项目。我现在正在尝试在我的MVC项目中使用Blazor项目中的组件。

我设法将组件呈现在MVC页面上，但是Blazor组件上的按钮单击不会触发组件的onclick事件，而是直接导航到https：// localhost：44341 /？

我不清楚我需要在MVC解决方案中进行哪些更改才能使其正常工作？官方文档讨论了在MVC项目中使用组件的问题，并且在与Dan Roth的视频聊天中提到了它，但是都没有详细介绍如何实现。

任何人都可以向我介绍如何将服务器端Blazor改造为MVC项目的完整步骤（或为我提供示例）吗？

我尝试过的

我的Blazor项目仍然具有标准模板的Counter组件，因此我尝试通过引用Blazor项目并将其添加到我的MVC解决方案中，然后将其添加到我的index.cshtml文件中：

<div id="Counter">
  @(await Html.RenderComponentAsync<Counter>())
</div>

可以正确渲染，但单击按钮不起作用。

我已将JS文件添加到MVC应用程序的_Layout页面：

<script src="_framework/blazor.server.js"></script>

在MVC项目的Startup.cs文件中打开“服务器端Blazor”：

services.AddServerSideBlazor();

我还向MVC项目添加了Pages和Shared目录，并复制了_Imports和MainLayout文件-不确定是否需要这样做。

如果这样做没有做，我尝试从所有Blazor模板（客户端，客户端托管和服务器端）中分解新项目以寻找线索，但是所有这些示例都设置为具有单个Blazor的完整SPA。入口点（App文件）托管在.html文件中，而我想在许多不同的现有MVC页面上呈现Blazor组件。

然后，我尝试将这些项目的一部分（以及我的Blazor项目的一部分）添加到MVC项目中，但是无法使其完全正常工作。

我也尝试按照这里的答案进行操作，但这是将Blazor组件文件添加到MVC项目中的工作，而我的Blazor文件当前（大多数情况下）在另一个项目中。

迄今为止我实验中的随机问题

• 我已经services.AddServerSideBlazor();在MVC应用程序的Startup.cs中添加了。还有什么需要的吗？
• 我的MVC应用仍然是传统的AspNetCore.Routing，如果仅将组件放在现有的MVC页面上（我将没有Blazor页面，而只有Blazor组件），是否仍需要切换到Core 3的端点路由。
• 浏览器中运行的blazor javascript文件与之通信的Blazor的服务器端部分是否需要通过端点路由？我从js文件的浏览器中收到404。
• 如果我只是托管组件，是否仍需要“ App”（App.razor）类/页面作为入口点？
• 如果是这样，我是否需要将<app>@(await Html.RenderComponentAsync<App>())</app>_Host.cshtml中的行放在我的MVC项目中的某个位置？
• 我是否需要从我的MVC项目中的Blazor项目中复制Pages和Shared文件夹，以及两个_Imports.razor文件和MainLayout.razor文件？
• 我认为Blazor现在是Microsoft.NETCore.Platforms文件的一部分（在MVC项目的SDK节点下引用），所以我是否认为我不需要为MVC项目的Blazor添加单独的NuGet包？

我有一个 .NET Core 3 Blazor（服务器端）应用程序，我最近将它从预览版 5 升级到了 .NET Core 3.0.1 预览版 6 版。当我在本地构建和运行它时，它工作正常；但是当尝试将其发布到文件系统文件夹（在框架相关模式下）时，它会引发此错误：

C:\Program Files\dotnet\sdk\3.0.100-preview6-012264\Sdks\Microsoft.NET.Sdk.Publish\targets\TransformTargets\Microsoft.NET.Sdk.Publish.TransformFiles.targets(192,5)：错误MSB4018：“TransformAppSettings”任务意外失败。System.IO.FileNotFoundException：无法加载文件或程序集“Newtonsoft.Json，版本=10.0.0.0，Culture=neutral，PublicKeyToken=30ad4fe6b2a6aeed”或其依赖项之一。该系统找不到指定的文件。文件名：'Newtonsoft.Json，版本=10.0.0.0，文化=中性，PublicKeyToken=30ad4fe6b2a6aeed'

在 Microsoft.NET.Sdk.Publish.Tasks.AppSettingsTransform.UpdateDestinationConnectionStringEntries(String destinationAppSettingsFilePath, ITaskItem[] destinationConnectionStrings) 在 Microsoft.NET.Sdk.Publish.Tasks.TransformAppSettings.TransformAppSettingsInternal() 在 Microsoft.NET.Sdk.Publish.Tasks。 TransformAppSettings.Execute() 在 Microsoft.Build.BackEnd.TaskExecutionHost.Microsoft.Build.BackEnd.ITaskExecutionHost.Execute() 在 Microsoft.Build.BackEnd.TaskBuilder.d__26.MoveNext()

或许值得一提的是，这个错误在预览版 5 版本中并没有发生。此外，我使用 Visual Studio Enterprise 2019 (Windows)。

到目前为止我尝试过的事情：（没有运气）

• 清理/重建解决方案
• 重新安装 .NET Core 3 预览版 6 SDK
• Newtonsoft.Json通过 Nuget添加包
• 在github上搜索社区提出的相关问题

.csproj 文件

<Project Sdk="Microsoft.NET.Sdk.Web">

  <PropertyGroup>
    <OutputType>Exe</OutputType>
    <TargetFramework>netcoreapp3.0</TargetFramework>
    <LangVersion>7.3</LangVersion>
    <AspNetCoreHostingModel>InProcess</AspNetCoreHostingModel>
  </PropertyGroup>

  <ItemGroup>
    <PackageReference Include="AutoMapper.Extensions.Microsoft.DependencyInjection" Version="6.1.0" />
    <PackageReference Include="MatBlazor" Version="1.2.0" />
    <PackageReference Include="Newtonsoft.Json" Version="12.0.2" />
    <PackageReference Include="SqlTableDependency" Version="8.5.3" />
    <PackageReference Include="System.DirectoryServices" Version="4.5.0" …

我正在尝试将一些代码从 WPF 迁移到 Blazor。WPF 代码依赖 ShowDialog() 来显示模式对话框并暂停执行，直到模式关闭。是否有（服务器端）Blazor 等效项允许基于 C# 控制流，例如，用户是否在模式对话框中单击了确认与取消？

如何在Blazor中为事件（OnInput）添加延迟？
例如，如果用户正在文本字段中输入，而您要等到用户完成输入。

Blazor.Templates :: 3.0.0-preview8.19405.7

码：

@page "/"
<input type="text" @bind="Data" @oninput="OnInputHandler"/>
<p>@Data</p>

@code {    
    public string Data { get; set; }   

    public void OnInputHandler(UIChangeEventArgs e)
    {
        Data = e.Value.ToString();
    }    
}

在 Blazor 应用程序中，我有一个<input type="text" />，并且我正在尝试执行某些操作，以便无法在其中输入非数字字符。

这是我到目前为止所做的，看起来效果很好：

<input type="text" @bind="InputContent" @bind:event="oninput" />

@code {
    string inputContent;
    string InputContent
    {
        get => inputContent;
        set => inputContent = StripNonDigits(value);
    }

    string StripNonDigits(string str)
    {
        return new String(str.Where(c => char.IsDigit(c)).ToArray());
    }
}

现在，我想知道：

• 还有哪些其他方法可以实现这一目标：“监视并可能修改用户输入的内容，特别是在 Blazor 中。” 例如，这可以在不使用 的情况下实现吗@bind？
• 我的做法是否存在潜在问题？或者说这是一个最优解？

在 JS 中，要做同样的事情，您将监听oninput事件，如果输入的字符不是数字，则执行event.preventDefault(). 据我所知，在 Blazor 中你不能完全做到这一点，对吗？

我正在重构我的代码以使用Refit来调用 WebApi 服务。接口已设置，我还创建了一个委托处理程序：

public class AuthHandler : DelegatingHandler
{
    private readonly TokenProvider tokenProvider;
    private readonly ISessionStorageService sessionStorage;

    public AuthHandler (
        TokenProvider tokenProvider, 
        ISessionStorageService sessionStorage)
    {
        this.tokenProvider = tokenProvider ?? throw new ArgumentNullException(nameof(tokenProvider));
        this.sessionStorage = sessionStorage ?? throw new ArgumentNullException(nameof(sessionStorage));
    }

    protected override async Task<HttpResponseMessage> SendAsync(HttpRequestMessage request, CancellationToken ct)
    {
        var someToken = await sessionStorage.GetItemAsync<string>("sometoken");

        request.Headers.Authorization = new AuthenticationHeaderValue("Bearer", tokenProvider.AccessToken);
        request.Headers.Add("someToken", someToken);

        return await base.SendAsync(request, ct).ConfigureAwait(false);
    }
}

并在Startup.cs：

services.AddBlazoredSessionStorage();
services.AddScoped<TokenProvider>();
services.AddScoped<AuthHandler>();

services.AddRefitClient<IApiService>().ConfigureHttpClient(options =>
{
    options.BaseAddress = …

我将使用新的 .NET 5 Blazor 框架创建一个 ERP 应用程序，其中包含 300 个页面和 250 个并发用户。我想知道开发 ERP 应用程序时首选哪种建模托管：Blazor Server 或 Blazor Web Assembly。

继其他人也已经做过的事情之后，在 Blazor 服务器应用程序 (Net Core 5.0 VS2019) 上，我实现了一个固定在顶部的 Bootstrap NavBarHorizo​​ntal，它工作正常，除了一个无法打开的下拉菜单。我只更改了两个页面中的代码，如下所示。其他一切都保持不变，包括 site.css。我也在下面的代码中包含了原始的 _Host.cshtml 。

// NavMenu
<nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-dark bg-primary fixed-top">
    <div class="d-none d-sm-block" style="padding:0 20px 0 0;">
        <img class="img-fluid" src="/Client/Images/CompanyLogo.png" alt="Company logo" style="width:auto; height:40px; padding:0 0 0 5px; margin:0" />
    </div>

    <button class="navbar-toggler" @onclick="ToggleNavMenu" type="button" data-toggle="collapse" data-target=".navbar-collapse" aria-controls="navbarSupportedContent"
            aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
    </button>

    <div class="@NavMenuCssClass navbar-collapse d-sm-inline-flex flex-sm-row-reverse" @onclick="CollapseNavMenu">
        <ul class="navbar-nav flex-grow-1">
            <li class="nav-item">
                <a class="nav-link text-light" href="" Match="NavLinkMatch.All">Home</a>
            </li>
            <li class="nav-item">
                <a class="nav-link text-light" href="#">About</a>
            </li> …