Blazor обертка для доступа к файловой системе Browser API
API позволяет читать и записать в вашу локальную файловую систему из браузера как файлов, так и каталогов.
Отказ от ответственности: API поддерживается на ограниченном наборе браузеров. Наиболее заметно не поддерживается на Firefox, Chrome для Android и мобильных браузеров iOS.
Проект образца может быть продемонстрирован по адресу https://kristofferstrube.github.io/blazor.filesystemaccess/
На каждой странице вы можете найти соответствующий код для примера в правом верхнем углу.
На главной странице вы можете увидеть, имеет ли API как минимум минимальная поддержка в использованном браузере.
На странице статуса вы можете увидеть, сколько из спецификаций WebIDL охватывала эта обертка.
Вам нужно установить .NET 7.0 или более новее, чтобы использовать библиотеку.
Скачать .NET 7
Вы можете установить пакет через Nuget с менеджером пакетов в вашем IDE или, в качестве альтернативы, используя командную строку:
dotnet add package KristofferStrube.Blazor.FileSystemAccessПакет можно использовать в проектах Blazor Webassembly и Blazor Server. (Обратите внимание, что потоковая передача больших файлов не поддерживается на сервере Blazor из -за задач пропускной способности.)
Вам также необходимо ссылаться на пакет, чтобы использовать его на страницах. Это можно сделать в _Import.razor , добавив следующее.
@ using KristofferStrube . Blazor . FileSystemAccess Простой способ сделать услугу доступным на всех ваших страницах - это зарегистрировать его в IServiceCollection , чтобы она могла быть введена зависимостью на страницах, которые нуждаются в этом. Это делается в Program.cs .
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 ( ) ; Затем сервис может быть введен на страницу, как SO:
@inject IFileSystemAccessService FileSystemAccessService ; Затем вы можете использовать IFileSystemAccessService , чтобы открыть один из трех диалогов, доступных в API файловой системы.
< 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 ();
}
}
}
}Не стесняйтесь открывать проблемы в репозитории, если вы найдете какие -либо ошибки в пакете или имеете желания для функций.
Известная проблема заключается в том, что использование потоков для потоковой передачи большого количества данных на Blazor Server не поддерживается.
В этом проекте используется пакет Blazor.filesyStem для возврата богатых FileSystemHandle S как FileSystemFileHande , так и файловой и FileSystemDirectoryHandle .
Этот репозиторий был построен с вдохновением и помощью следующей серии статей: