Blazor.FileSystemAccess Download - Blazor.FileSystemAccess Código fonte download

Blazor.FileSystemAccess

Outros recursos

1.0.0

Baixar

Introdução

Um invólucro blazor para o acesso ao sistema de arquivos da API do navegador

A API possibilita ler e gravar no sistema de arquivos local do navegador, ambos os arquivos e diretórios.

Isenção de responsabilidade: A API é suportada em um conjunto limitado de navegadores. O mais perceptível não suportado no Firefox, Chrome para navegadores móveis Android e iOS.

Demonstração

O projeto de amostra pode ser demonstrado em https://kristofferstribe.github.io/blazor.filesystemaccess/

Em cada página, você pode encontrar o código correspondente para o exemplo no canto superior direito.

Na página principal, você pode ver se a API tem pelo menos suporte mínimo no navegador usado.

Na página de status, você pode ver quanto das especificações do WebIDL este wrapper cobrou.

Começando

Pré -requisitos

Você precisa instalar o .net 7.0 ou mais recente para usar a biblioteca.

Download .NET 7

Instalação

Você pode instalar o pacote via NuGet com o gerenciador de pacotes no seu IDE ou alternativamente usando a linha de comando:

dotnet add package KristofferStrube.Blazor.FileSystemAccess

Uso

O pacote pode ser usado nos projetos Blazor WebAssembly e Blazor Server. (Observe que o streaming de arquivos grandes não é suportado no servidor Blazor devido a problemas de largura de banda.)

Importar

Você também precisa fazer referência ao pacote para usá -lo em suas páginas. Isso pode ser feito em _Import.razor , adicionando o seguinte.

 @ using KristofferStrube . Blazor . FileSystemAccess

Adicionar à coleção de serviços

Uma maneira fácil de disponibilizar o serviço em todas as suas páginas é registrando -o no IServiceCollection , para que possa ser injetado nas páginas que precisam. Isso é feito no Program.cs adicionando o seguinte antes de criar o host e executá -lo.

 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 ( ) ;

Injetar na página

Então o serviço pode ser injetado em uma página como assim:

 @inject IFileSystemAccessService FileSystemAccessService ;

Em seguida, você pode usar IFileSystemAccessService para abrir um dos três diálogos disponíveis na API do FileSystemAccess como esta:

< 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 ();
            }
        }
    }
}