标签: blazor-webassembly

使用模板：启用 ASP.NET Core 托管的 Blazor WebAssembly 应用程序

它创建项目：

• BlazorApp1.Client
• BlazorApp1.服务器

我可以看到服务器有一个对客户端的项目引用，但我无法确定哪些代码允许服务器显示客户端？

服务器如何知道客户端索引文件位于另一个程序集中？

客户端代码是否托管在同一端口上的服务器项目中？

我有点迷失试图弄清楚这一点。

我的 navlink 定义如下

<NavLink href="/intro"></NavLink>

在开发中，它工作正常，因为网站的根目录与 blazor 应用程序处于同一级别。在 prod 中，我必须将 blazor 站点放在默认 iis 网站的文件夹中。所以我的网址变成这样

http://something/apps/cor/

所以最终<NavLink href="/intro"></NavLink>试图去http://something/introhttp://something/apps/cor/intro

我尝试了两者/intro，并且intro两者都导致了错误的行为。我不知道如何使这些链接相对于 blazor root 而不是 iis root。

几天来，我尝试申报 Blazor 应用程序的索赔。我终于找到了一种应该可行的方法，但由于某种原因，我无法在索赔列表中找到我的索赔。我创建了以下 AppClaimsPrincipalFactory：

public class AppClaimsPrincipalFactory : UserClaimsPrincipalFactory<ApplicationUser>
{
    public AppClaimsPrincipalFactory(UserManager<ApplicationUser> userManager, IOptions<IdentityOptions> optionsAccessor) : base(userManager, optionsAccessor)
    {
    }
    public override async Task<ClaimsPrincipal> CreateAsync(ApplicationUser user)
    {
        var id = await GenerateClaimsAsync(user);
        if (user != null)
        {
            id.AddClaim(new Claim(ClaimTypes.GivenName, user.FirstName));
        }
        return new ClaimsPrincipal(id);


        var principal = await base.CreateAsync(user);

        if (!string.IsNullOrWhiteSpace(user.FirstName))
        {
            ((ClaimsIdentity)principal.Identity).AddClaim(new Claim(ClaimTypes.GivenName, user.FirstName));
        }

        if (!string.IsNullOrWhiteSpace(user.LastName))
        {
            ((ClaimsIdentity)principal.Identity).AddClaim(new Claim(ClaimTypes.Surname, user.LastName));
        }

        return principal;
    }
}

我在Startup.cs文件的ConfigureServices中添加了以下代码：

services.AddScoped<IUserClaimsPrincipalFactory<ApplicationUser>, AppClaimsPrincipalFactory>();

有人可以帮我找出我的代码有什么问题吗？先感谢您。

更新

感谢布莱恩·帕克为我铺平了道路。为了使其在其他人需要时能够工作，我更改了 AppClaimsPrincipalFactory 类，如下所示：

public class AppClaimsPrincipalFactory : UserClaimsPrincipalFactory<ApplicationUser> …

有一个 Web 表单应用程序，我希望通过将 Blazor 嵌入到 Web 表单页面中（就像使用 Angular 一样），逐页地将其逐渐移植到 Blazor WebAssembly。

将 Blazor 应用程序发布到 Web Forms 项目中名为“Blazor”的子目录下。如果我运行 Web 表单应用程序并点击 http://localhost:1234/Blazor，则 Blazor 应用程序运行良好（编辑 Blazor index.html => 后<base href="/Blazor/" />）。但是，当我尝试将 Blazor 嵌入 Web 表单页面时，它不起作用。Web 表单页面 asp:content 包含 Blazor index.html 页面包含的内容：

<%@ Page Title="EmbedTest" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="EmbedTest.aspx.cs" Inherits="WebFormBlazor.EmbedTest" %>

<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
    <app>Loading...</app>

    <div id="blazor-error-ui">
        An unhandled error has occurred.
        <a href="" class="reload">Reload</a>
        <a class="dismiss"></a> 
    </div>

    <script src="/Blazor/wwwroot/_framework/blazor.webassembly.js"></script>
</asp:Content>

当我访问 http://localhost:1234/EmbedTest 时，页面显示：正在加载...发生了未处理的错误。重新加载

并在控制台中显示以下错误消息： Uncaught SyntaxError: Unexpected token '<' blazor.webassemble.js:1 …

我正在开发一个 Blazor Wasm 应用程序，它使用资源文件 (.resx) 进行本地化。

当查看微软的官方文档/和示例解决方案时，似乎更改语言需要重新加载整个应用程序？（文档）

有人有解决方法可以在语言更改时不重新加载应用程序吗？我需要将翻译保留在 .resx 文件中，因此解决方法仍应基于 .resx 文件...

我需要onclick在子组件中发生该事件，ShowMessage在父组件中执行方法，传递message字符串作为参数。以下代码不起作用：

儿童剃须刀：

    <input type="text" @bind-value="@message" @onclick="OnClickCallback"/>

    <button @onclick="ChangePassword">Parent button</button>

@code {
    private string message;
    
    [Parameter]
    private string Message {get; set;}

    [Parameter]
    public EventCallback<MouseEventArgs> OnClickCallback {get; set;}

    [Parameter]
    public EventCallback<string> OnClick { get; set; }

    private async Task ChangePassword()
    {
        await OnClick.InvokeAsync(message);
    }
    
}

父剃刀：

@page "/parent"

<Child @bind-Message="message" OnClickCallback="@ShowMessage"></Child>

<p>@message</p>

@code {
    private string message;

    private void ShowMessage(MouseEventArgs args, string e)
    {
        message = e;
    }
}

错误：无法从“方法组”转换为“EventCallback”OnClickCallback="@ShowMessage"

<EditForm Model="@_newRegister" OnValidSubmit="@HandleValidSubmit">
  <DataAnnotationsValidator />
  <ValidationSummary />
  <div class="container-fluid">
    <div class="row">
     <div class="col-6">
      <div class="form-group">
        <MudDatePicker Label="Collection Date" Editable="true" @bind-Date="_newRegister.CollectionDate" />
      </div>
     </div>
    </div>
  </div>
</Editform>

@code{
private Register _newRegister = new x.Shared.Register
{
    ProcessingDate = DateTime.Today,
    CollectionDate = DateTime.Today,
    ModifiedDate = DateTime.Today,
    CreateDate = DateTime.Today
};

private string Success = "";
DateTime? date = DateTime.Today;

public void HandleValidSubmit()
{

    Success = "Success";

}
)

public class Register
{
    [Key]
    public int ID { get; set; }
    public String CustomerName …

我有一个 Blazor Web assembly ASP.NET Core 托管应用程序，在服务器上我有一个返回文件的控制器，在客户端上我希望有一个按钮，当用户单击它时下载文件，我怎样才能实现这？

这是我的控制器

[HttpGet("{reportName}")]
public FileResult GetReport(string reportName)
{
     var stream = _reportPrintRepository.Print(reportName);

     return File(stream, System.Net.Mime.MediaTypeNames.Application.Pdf, reportName + ".pdf");
}

我正在使用 blazor web assembly，我需要显示在客户端存储为字节数组的图像。

我试过

在 C# 中：

imagesrc= Convert.ToBase64String(imageBytes);
imageDataURL = string.Format("data:image/jpeg;base64,{0}", imagesrc);

在标记中：

<img src="@imageDataURL" />

但没有显示图像，只是没有图像的图标。

还有其他办法吗？

我想将 application Insights sdk 添加到 blazor Web Assembly 项目中。我发现了多篇文章，例如网页的 Application Insights和stackoverflow，它们正是我正在寻找的东西。但是，在添加来自 microsoft 链接的代码片段并在页面上使用 connectionString over InstrumentationKeyindex.html并注入IJSRuntime以从 .NET 代码调用 JavaScript 方法，然后调用 Application Inisghts 方法之后...在主页顶部运行应用程序时页面我将看到@inject IJSRuntime _jsRuntime。

我是否没有正确设置注射？另外，我是否需要将这些代码行添加到每个剃刀组件（页面文件夹）中，或者只是将其放在index.html将涵盖从开始到结束的所有内容，无论我单击什么以及呈现哪个页面？

Index.html

@inject IJSRuntime _jsRuntime

<!DOCTYPE html>
<html>

<head>
    <script type="text/javascript">
        !function (T, l, y) { var S = T.location, k = "script", D = "connectionString", C = "ingestionendpoint", I = "disableExceptionTracking", E = "ai.device.", b = "toLowerCase", w = "crossOrigin", N = "POST", e …