Blazor Wasm如何加载本地文件？读取本地文件报错求助

你的代码抛出“Could not find file”异常的核心原因是浏览器安全沙箱限制：Blazor Wasm运行在浏览器环境中，网页代码被严格禁止直接通过本地文件路径（如file:///C:/Users/user01/Downloads/test.txt）访问用户设备上的文件——这是浏览器为保护用户隐私和安全的基础策略。FileInfo是.NET针对本地文件系统的API，在Wasm客户端环境中无法直接访问本地文件系统。

下面是两种可行的解决方案：

方案一：使用Blazor内置InputFile组件（官方推荐） #

利用Blazor提供的InputFile组件让用户主动选择文件，即可安全读取文件大小：

<InputFile OnChange="HandleFileSelection" accept=".txt" />

@if (selectedFileSize.HasValue)
{
    <p>选中文件大小：@selectedFileSize 字节</p>
}

@code {
    private long? selectedFileSize;

    private void HandleFileSelection(InputFileChangeEventArgs args)
    {
        var selectedFile = args.File;
        selectedFileSize = selectedFile.Size;
    }
}

说明： #

• InputFile组件会唤起浏览器的文件选择对话框，用户主动选择文件后，代码才能获得文件的只读访问权限
• InputFileChangeEventArgs包含选中的文件集合，通过File.Size可直接获取文件大小（单位：字节）
• accept=".txt"用于限制仅可选择txt文件，可根据需求修改或移除该属性

方案二：自定义文件选择按钮（结合原生input） #

如果需要自定义按钮样式，可使用原生<input type="file">配合Blazor的事件处理：

<button class="btn btn-primary" onclick="document.getElementById('hiddenFileInput').click()">选择文件</button>
<input id="hiddenFileInput" type="file" accept=".txt" style="display: none;" @onchange="OnFileChanged" />

<p>选中文件大小：@fileSize 字节</p>

@code {
    private long fileSize;

    private void OnFileChanged(ChangeEventArgs args)
    {
        var files = args.Value as IReadOnlyList<Microsoft.AspNetCore.Components.Forms.IBrowserFile>;
        if (files?.Any() == true)
        {
            fileSize = files.First().Size;
        }
    }
}

关键注意事项： #

• 所有读取本地文件的操作必须由用户主动触发（如点击按钮后选择文件），代码无法直接通过路径访问本地文件
• 浏览器仅允许网页读取用户主动选择的文件，且只能获取文件的元数据（大小、名称等）和只读内容流，无法修改或访问其他本地文件

内容的提问来源于stack exchange，提问作者takatto