Blazor Server InputFile 在移动设备中不起作用答案

【问题标题】：Blazor Server InputFile won't work in mobileBlazor Server InputFile 在移动设备中不起作用
【发布时间】：2021-12-03 18:27:44
【问题描述】：

您好，我在 Blazor Server (.NET 6) 中使用 InputFile 组件，它在桌面浏览器中就像一个魅力，但在移动设备中，它只是不起作用！

代码如下：

<div class="col-md-12">
                        <label class="form-label">
                            @Localizer["pet-information-photograph"]
                            <button type="button" class="btn btn-outline-modal f-15 rounded-circle font-weight-bold white btn-sm" @onclick="@(() => ModalPetPhotograph())">?</button>
                        </label>
                        <InputFile class="form-control" OnChange="ProcessPhotographs" accept=".png,.pdf" />
                        <small>@Localizer["page-rus-petInformation-fileValidateSize"]</small>
                    </div>

以及方法：

 async Task ProcessPhotographs(InputFileChangeEventArgs e)
        {
            photographBase64 = string.Empty;

            if (e.FileCount > 0)
            {
                foreach (var img in e.GetMultipleFiles(1))
                {
                    var arrbytes = new byte[img.Size];
                    try
                    {
                        if (img.Size < 1024000 && (img.ContentType.Contains("png") || img.ContentType.Contains("jpg") || img.ContentType.Contains("pdf")))
                        {
                            await img.OpenReadStream(1024000).ReadAsync(arrbytes);
                            photographBase64 = $"data:{img.ContentType};base64,{Convert.ToBase64String(arrbytes)}";
                        }
                        else
                        {
                            ToastService.ShowWarning(Localizer["page-petInformation-fileValidateSize"], Localizer["toast-warning"]);
                            isLoading = false;
                            return;
                        }
                    }
                    catch (Exception ex)
                    {
                        logger.LogError(ex, ex.Message);
                    }
                }
            }
            else
            {
                ToastService.ShowWarning(Localizer["msg-toast-photograph"], Localizer["rus-toast-warning"]);
                isLoading = false;
                return;
            }
            additionalPet.Photograph = photographBase64;
        }

任何想法，如何使其适用于移动设备？

【问题讨论】：

检查this 代码 - 它是我的应用程序中的一个组件，我设计它用于在 blazor 服务器中上传图片。使用 MudBlazor 按钮，但在这种情况下，它对您来说并不重要。它也适用于移动设备。

标签： blazor blazor-server-side

【解决方案1】：

我发现了问题，原来是我读取文件的方式导致了问题，经过多次尝试，我们描述了错误的代码并将其替换为：

using (var ms = new System.IO.MemoryStream())
                        {
                            await img.OpenReadStream(1024000).CopyToAsync(ms);
                            var arrbytes = ms.ToArray();

【讨论】：