Blazor 服务器输入文件在移动设备中不起作用

Question

嗨，我在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;
}

有什么想法吗，如何使其适用于移动设备？

Answer 1

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

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