Загрузка файлов в Blazor не идет в папку загрузки в wwwroot - PullRequest
0 голосов
/ 10 февраля 2020

В моем Blazorapplication у меня есть папка wwwroot/upload, куда я хочу загрузить изображения. Однако изображения не попадают в каталог.

Мой код -

async Task UploadFile()
{

    if (file != null)
    {
        // Just load into .NET memory to show it can be done
        // Alternatively it could be saved to disk, or parsed in memory, or similar
        var ms = new System.IO.MemoryStream();
        await file.Data.CopyToAsync(ms);

        status = $"Finished loading {file.Size} bytes from {file.Name}";

        // TODO: Need to upload the file to wwwroot/upload
        var content = new MultipartFormDataContent {
          { new ByteArrayContent(ms.GetBuffer()), "\\upload\\", file.Name }
        };


        await Http.PostAsync("api/Blog/UploadFeaturedImage", content);
    }
}

Почему файл не попадает в пункт назначения?

ОБНОВЛЕНИЕ

Мои api / Blog / UploadFeaturesImage ниже, я думаю, что проблема заключается здесь. Он загрузил все файлы в папку в проекте API под названием Upload. Как я могу сказать, чтобы загрузить на wwwroot/upload, пожалуйста?

[Authorize]
    [HttpPost("[action]")]
    public async Task UploadFeaturedImage()
    {
        if (HttpContext.Request.Form.Files.Any())
        {
            foreach (var file in HttpContext.Request.Form.Files)
            {
                var path = Path.Combine(Environment.CurrentDirectory, "upload", file.FileName);
                using (var stream = new FileStream(path, FileMode.Create))
                {
                    await file.CopyToAsync(stream);
                }
            }
        }
    }

1 Ответ

0 голосов
/ 10 февраля 2020

Не уверен, поможет ли это вам, но у меня есть пакет Nuget с именем BlazorFileUpload, который поставляется с примером проекта:

https://github.com/DataJuggler/BlazorFileUpload

Это основано на BlazorInputFile от SteveSanderson, создателя Blazor в Microsoft.

Код бритвы:

@ с использованием DataJuggler.Blazor.FileUpload

<FileUpload CustomSuccessMessage="Your file uploaded successfully." 
    OnChange="OnFileUploaded" FilterByExtension="true" 
    ShowStatus="false"  PartialGuidLength="10" MaxFileSize="4194304"        
    ShowCustomButton="true" ButtonText="Select File" 
    CustomButtonClassName="buttonwide"        
    AllowedExtensions=".jpg;.png;" ShowResetButton="true" OnReset="OnReset" 
    ResetButtonClassName="button" ResetButtonText="Reset"
    CustomExtensionMessage="Only .jpg and .png files are allowed." 
    AppendPartialGuid="true"                
    FileTooLargeMessage="The file uploaded must be 4 megabytes or smaller.">
</FileUpload>

Вызов события OnFileUploaded вызывается после файл загружен:

/// <summary>
/// method returns the File Uploaded
/// </summary>
private void OnFileUploaded(UploadedFileInfo uploadedFileInfo)
{
    // if aborted
    if (uploadedFileInfo.Aborted)
    {
        // get the status
        status = uploadedFileInfo.ErrorMessage;
    }
    else
    {
        // get the status
        status = "The file " + uploadedFileInfo.FullName + " was uploaded.";

        // other information about the file is available
        //DateTime lastModified = uploadedFileInfo.LastModified;
        //string nameAsItIsOnDisk = uploadedFileInfo.NameWithPartialGuid;
        //string partialGuid = uploadedFileInfo.PartialGuid;
        //long size = uploadedFileInfo.Size;
        //string type = uploadedFileInfo.Type;

        // The above information can be used to display, and / or process a file
    }
}

Пример проекта находится в папке Samples перечисленных выше репо Git.

Компонент UploadDirectory компонента FileUpload по умолчанию имеет значение wwwroot/Upload, поэтому это должно работать для вас:

[Parameter]
public string UploadFolder { get; set; } = "wwwroot/Upload/";

Я почти закончил с образцом BlazorImageGallery, это должно быть сделано позже на этой неделе:

enter image description here

Существует также видео, которое поставляется с проектом BlazorFileUpload, если кто-то хочет посмотреть: https://youtu.be/Hj_k90mifSQ

Возможно, это кому-нибудь поможет.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...