KristofferStrube.Blazor.FileSystemAccess 3.2.2

The ID prefix of this package has been reserved for one of the owners of this package by NuGet.org. Prefix Reserved
dotnet add package KristofferStrube.Blazor.FileSystemAccess --version 3.2.2
NuGet\Install-Package KristofferStrube.Blazor.FileSystemAccess -Version 3.2.2
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package.
<PackageReference Include="KristofferStrube.Blazor.FileSystemAccess" Version="3.2.2" />
For projects that support PackageReference, copy this XML node into the project file to reference the package.
paket add KristofferStrube.Blazor.FileSystemAccess --version 3.2.2
#r "nuget: KristofferStrube.Blazor.FileSystemAccess, 3.2.2"
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package.
// Install KristofferStrube.Blazor.FileSystemAccess as a Cake Addin
#addin nuget:?package=KristofferStrube.Blazor.FileSystemAccess&version=3.2.2

// Install KristofferStrube.Blazor.FileSystemAccess as a Cake Tool
#tool nuget:?package=KristofferStrube.Blazor.FileSystemAccess&version=3.2.2

License: MIT GitHub issues GitHub forks GitHub stars NuGet Downloads (official NuGet)

Introduction

A Blazor wrapper for the browser API File System Access

The API makes it possible to read and write to your local file system from the browser both files and directories.

Disclaimer: The API is supported on a limited set of browsers. Most noticeable not supported on Firefox, Chrome for Android, and iOS mobile browsers.

Demo

The sample project can be demoed at https://kristofferstrube.github.io/Blazor.FileSystemAccess/

On each page you can find the corresponding code for the example in the top right corner.

On the main page you can see if the API has at least minimal support in the used browser.

On the Status page you can see how much of the WebIDL specs this wrapper has covered.

Getting Started

Prerequisites

You need to install .NET 7.0 or newer to use the library.

Download .NET 7

Installation

You can install the package via Nuget with the Package Manager in your IDE or alternatively using the command line:

dotnet add package KristofferStrube.Blazor.FileSystemAccess

Usage

The package can be used in Blazor WebAssembly and Blazor Server projects. (Note that streaming of big files is not supported in Blazor Server due to bandwidth problems.)

Import

You also need to reference the package in order to use it in your pages. This can be done in _Import.razor by adding the following.

@using KristofferStrube.Blazor.FileSystemAccess

Add to service collection

An easy way to make the service available in all your pages is by registering it in the IServiceCollection so that it can be dependency injected in the pages that need it. This is done in Program.cs by adding the following before you build the host and run it.

var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("#app");
builder.RootComponents.Add<HeadOutlet>("head::after");

// Other services are added.

builder.Services.AddFileSystemAccessService();

await builder.Build().RunAsync();

Inject in page

Then the service can be injected in a page like so:

@inject IFileSystemAccessService FileSystemAccessService;

Then you can use IFileSystemAccessService to open one of the three dialogs available in the FileSystemAccess API like this:

<button @onclick="OpenAndReadFile">Open File Picker for Single File and Read</button>
<br />
@Text

@code {
    private string Text = "";

    private async Task OpenAndReadFile()
    {
        FileSystemFileHandle? fileHandle = null;
        try
        {
            OpenFilePickerOptionsStartInWellKnownDirectory options = new()
                {
                    Multiple = false,
                    StartIn = WellKnownDirectory.Downloads
                };
            var fileHandles = await FileSystemAccessService.ShowOpenFilePickerAsync(options);
            fileHandle = fileHandles.Single();
        }
        catch (JSException ex)
        {
            // Handle Exception or cancelation of File Access prompt
            Console.WriteLine(ex);
        }
        finally
        {
            if (fileHandle is not null)
            {
                var file = await fileHandle.GetFileAsync();
                Text = await file.TextAsync();
                StateHasChanged();
            }
        }
    }
}

Issues

Feel free to open issues on the repository if you find any errors with the package or have wishes for features.

A known issue is that using Streams to stream large amount of data in Blazor Server is not supported.

This project uses the Blazor.FileSystem package to return rich FileSystemHandles both FileSystemFileHandes and FileSystemDirectoryHandles.

This repository was build with inspiration and help from the following series of articles:

Product Compatible and additional computed target framework versions.
.NET net7.0 is compatible.  net7.0-android was computed.  net7.0-ios was computed.  net7.0-maccatalyst was computed.  net7.0-macos was computed.  net7.0-tvos was computed.  net7.0-windows was computed.  net8.0 was computed.  net8.0-android was computed.  net8.0-browser was computed.  net8.0-ios was computed.  net8.0-maccatalyst was computed.  net8.0-macos was computed.  net8.0-tvos was computed.  net8.0-windows was computed. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last updated
3.2.2 6,835 10/19/2023
3.2.1 1,233 10/5/2023
3.2.0 7,587 3/16/2023
3.1.0 1,023 2/15/2023
3.0.0 1,440 1/11/2023
2.1.0 1,174 11/18/2022
2.0.0 524 11/10/2022
1.2.1 1,011 10/10/2022
1.2.0 394 10/7/2022
1.1.0 854 8/19/2022
1.0.1 512 7/12/2022
1.0.0 438 6/28/2022
0.2.0 437 6/14/2022
0.1.0 553 4/26/2022