受欢迎的博客标签

ASP.NET Core Blazor - Blazor File System Access 文件系统访问 组件

Published
Created: 2025年6月30日星期一 15:59:09 Latest updated:2025年6月30日星期一 16:25:37 views(6)

File System Access API 让浏览器拥有操作本地文件的能力

Table of Contents

前言

Web 应用程序与用户本地设备上的文件进行交互。

在没有文件系统API之前，JS是不能对磁盘中的文件进行修改 写入磁盘的。有了File System API之后，就能对电脑设备磁盘中的文件进行修改，删除，创建（为了安全只能对非系统文件进行操作，且必须得到用户授权）


File System Access API（以前称为 Native File System API，在此之前称为 Writeable Files API）使开发人员能够构建强大的 Web 应用程序，与用户本地设备上的文件进行交互，例如 IDE、照片和视频编辑器、文本编辑器等。用户授予 Web 应用访问权限后，此 API 允许他们直接读取或保存对用户设备上文件和文件夹的更改。除了读取和写入文件之外，文件系统访问 API 还提供打开目录和枚举其内容的能力。

 

File System Access API

File System API前端文件系统API


File System Access API 是一项 Web API，允许 Web 应用程序从用户设备的本地文件系统中读取和写入文件。

它提供了一种简单且安全的方法，让用户在不离开 Web 应用的情况下，从本地文件系统中操作文件。

这项 API 为 Web 应用程序提供了更多的灵活性和功能，使其更接近于本地应用程序的体验。

File System Access API 遵循同源策略，只允许 Web 应用程序在具有相同源的文件系统上进行操作。

当用户使用该 API 时，会提示用户授权应用程序访问他们的文件系统。

如果用户授权，则应用程序可以使用该 API 访问用户选择的文件和目录。

使用 File System Access API 可以访问本地文件系统，从而实现一些有用的功能，例如：

将文件从本地文件系统上传到 Web 应用程序；
将 Web 应用程序中的数据写入到本地文件系统中；
在用户的本地文件系统上创建、重命名和删除文件；
读取本地文件系统上的文件内容。

 

文件系统访问 API（File System Access API）

https://github.com/BootstrapBlazor/BootstrapBlazor.FileSystem

guide：

https://developer.mozilla.org/zh-CN/docs/Web/API/File_System_API

 

Blazor.FileSystemAccess

1.Blazor FileSystemAccess 是一个为 Blazor 应用提供的文件系统访问 API 的封装库。它允许开发者在 Blazor WebAssembly 和 Blazor Server 项目中读取和写入本地文件系统

https://github.com/KristofferStrube/Blazor.FileSystemAccess

dotnet add package KristofferStrube.Blazor.FileSystemAccess

https://blog.csdn.net/gitblog_00643/article/details/141773060

 

2.

https://github.com/BootstrapBlazor/BootstrapBlazor.FileSystem

dotnet add package BootstrapBlazor.FileSystem

https://www.cnblogs.com/densen2014/p/16812225.html

 

How to use

Nuget

BootstrapBlazor.FileSystem

 

应用案例

Blazor WebAssembly 访问文件系统修改图片并保存在本地目录

https://blog.arencore.me/posts/dotnet-blazorfileaccess/

 

https://www.cnblogs.com/densen2014/p/16812225.html

https://juejin.cn/post/7203701875530039357