Blazor：从 Blazor 页面列出和链接本地 HTML 文件答案

【问题标题】：Blazor: listing and linking local HTML files from Blazor pageBlazor：从 Blazor 页面列出和链接本地 HTML 文件
【发布时间】：2021-07-13 09:32:55
【问题描述】：

我需要列出运行 Blazor 服务器的机器上的 HTML 文件。 HTML 页面由另一个应用程序生成。我能够检索所有 HTML 文件名并在 Blazor 页面上列出它们（为找到的每个 HTML 文件创建一个 <a href="file:///path_to_local_html_file">actual_file_name</a>）。但是，在我的 Blazor 页面上单击指向 HTML 文件的链接时，没有任何反应。当我在链接上使用人民币并选择Open link in new tab时，它只会加载一个地址为about:blank#blocked的空页面。

我对 Blazor 没有太多经验，但我想不访问 Blazor 页面范围之外的文件和目录是某种保护。

我的 Blazor 服务器来自此 MSDN 教程并且正在运行：https://dotnet.microsoft.com/learn/aspnet/blazor-tutorial/run

我自己的代码如下（在Index.razor中添加）：

<p>@((MarkupString)myString)</p>

@code {
    private string myString = LoadFiles();
    private static string LoadFiles()
    {
        System.Text.StringBuilder sb = new System.Text.StringBuilder();
        foreach (var file in System.IO.Directory.GetFiles(@"C:\Temp"))
        {
            sb.AppendLine($"<a href=\"file:///{file.Replace(@"\", "/")}\" target=\"_blank\">{file}</a><br/>");
        }
        foreach (var folder in System.IO.Directory.GetDirectories(@"C:\Temp"))
        {
            sb.AppendLine($"<p>{folder}</p>");
        }
        return sb.ToString();
    }
}

Blazor 应用位于C:\projects\BlazorApp，HTML 文件位于同一台机器上的C:\Temp。

如何在 Blazor 页面中创建指向这些 HTML 文件的有效链接？

我无法控制应用程序创建 HTML 文件，所以我只能检查是否有可用的文件。如果可用，如上所述，我需要链接它们。

提前致谢！

【问题讨论】：

由于尚未有人回答您 - 高级概述：您无法访问文件系统以从 Blazor 内部读取 C 驱动器中的任何内容，因为 Blazor 将您的操作范围限定为浏览器窗口内的网页.您必须通过服务器应用程序读取 HTML 并将 HTML 发送到 Blazor 前端，然后前端必须接受并呈现该 HTML。
感谢您的回复。显示文件内容是如此简单，以至于我没有想到这一点。 :D

标签： c# html blazor

【解决方案1】：

根据 JeremyW 的说法，我将读取文件的内容并将其显示为 MarkupString。因此我准备了一个页面，它接收完整的文件路径作为参数（在 URL 中），然后读取文件。

@inject NavigationManager navManager
@((MarkupString)htmlContent)
@code {
    private string htmlContent = "";
    protected override void OnInitialized()
    {
        var URL_PARAMS = GetURLParameters(navManager);
        htmlContent = ReadHtmlFile(URL_PARAMS);
    }
}

在 HTML 文件中还有指向其他本地文件的附加链接。所以我在将实际内容传递给htmlContent 变量之前更新了这些链接。现在，这些链接中的每一个都指向同一个 blazor 页面，再次提供文件的文件路径作为参数。

http://localhost:44444/readFilePage?fullPath=C%3a\Files%3a\data.html

【讨论】：