How can I import Excel-files from Blazor?

Question

I have a webapplication. There is a function who import Excel-workbooks. I want to import contents of one or more Excel-workbooks with 52-sheets (weeks). What do I wrong? Can anybody help me?

• Why are ContentType/ContentDisposition a null reference. How can I solve this?
• What has to be the content of "name"? Is that the same as fileName?
• The error message of null-reference is showing in the service: var data = JsonConvert.SerializeObject(model); .

In the razor page you have two buttons Select and Import

                    <div class="d-inline">
                        <label for="file" class="btn myButtonClass">
                            selecteer
                        </label>
                        <InputFile class="btn myButtonClass"
                               id="file" multiple
                               OnChange="@OnInputFileChange" />
                    </div> 

@code
{
    ...
    private IReadOnlyList<IBrowserFile> list;

    private async Task OnInputFileChange(InputFileChangeEventArgs e)
    {
        list = e.GetMultipleFiles();

        await _JsRuntime.InvokeAsync<string>("updateList");
    }

    public async Task DoImport()
    {
        _model.MinWeek = WeekFrom;
        _model.MaxWeek = WeekTo;

        foreach (var item in list)
        {
            Stream stream = item.OpenReadStream(Int64.MaxValue);
            var file = new FormFile(stream, 0, stream.Length, "\"files\"", item.Name);
            //file.ContentType = "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
            //file.ContentDisposition= "x-file-name";

            _model.ImportFile.Add(file);
        }

        await _listService.Import(_model);
    }

In the service:

public async Task<string> ImportHitlijst(ImportSelectModel model)
{
    try
    {
        var data = JsonConvert.SerializeObject(model);

        HttpContent content = new StringContent(data, Encoding.UTF8, "application/json");

        var httpResponseMessage = await _httpClient.PostAsync($"api/Hitlijst/SubmitFiles", content);

        if (httpResponseMessage.IsSuccessStatusCode)
        {
            return "Saved successful";
        }

        return "Not saved";
    }
    catch (Exception ex)
    {
        string message = ex.Message;

        return "Error with message: " + message;
    }
}

... and then in the API:

        [HttpPost("SubmitFiles")]
        [RequestSizeLimit(long.MaxValue)]
        public async Task<IActionResult> SubmitFiles([FromForm] ImportSelectModel model)
        {
            if (model.ImportFile.Count > 0)
            {
...

I use a model:

 public class ImportSelectModel
    {
        public int MinWeek { get; set; }
        public int MaxWeek { get; set; }
        [Required] public List<IFormFile> ImportFile { get; set; } = new();
    }

Any suggestion is appreciated. Thank you!

Answer 1

You have to define the Headers and ContentType:

 public async Task OnInputFileChange(InputFileChangeEventArgs e)
    {
        var files = e.GetMultipleFiles(int.MaxValue);

        foreach (var file in files)
        {
            IBrowserFile uploadedFile = file;
            Stream stream = file.OpenReadStream(Int64.MaxValue);

            var formFile = new FormFile(stream, 0, stream.Length, null, file.Name)
                {
                    Headers = new HeaderDictionary(),
                    ContentType = uploadedFile.ContentType
                };

            _model.ImportFile.Add(formFile);
            Bestandnamen.Add(file.Name);
        }

        StateHasChanged();
    }