温馨提示:本文翻译自stackoverflow.com,查看原文请点击:其他 - Allow only specific file type to upload in blazor
asp.net-blazor blazor blazor-client-side blazor-server-side

其他 - 只允许特定文件类型在blazor中上传

发布于 2020-08-05 00:47:21

我正在使用BlazorInputFile软件包在Blazor中上传文件。

问题

此代码不起作用。

<InputFile OnChange="OnFileUpload" accept="image/x-png,image/jpeg" title="Upload jpeg or png image" />

如何限制用户只能在Blazor中上传jpeg或png?请让我知道是否需要更多的东西来支持这个问题。

查看更多

提问者
Bijay Yadav
被浏览
223
Data Juggler 2020-04-26 09:37

我有一个包装到Steve Sanderson的InputFile的包装,该包装具有AllowedExtensions属性。这是事实筛选器之后的内容,这意味着用户必须上传文件,然后您告诉他们不允许文件扩展名。整个线程都在进行预上传方式,至少可以说很难。

这是我上传后的处理方式:

Nuget:DataJuggler.Blazor.FileUpload

包括Blazor示例项目的完整源代码位于:

https://github.com/DataJuggler/BlazorFileUpload

最相关的部分总结如下:

使用DataJuggler.Blazor.FileUpload

<FileUpload CustomSuccessMessage="Your file uploaded successfully." 
    OnReset="OnReset" ResetButtonClassName="localbutton" ShowStatus="false"
    PartialGuidLength="10" MaxFileSize=@UploadLimit FilterByExtension="true" 
    ShowCustomButton="true"  ButtonText="Start" OnChange="OnFileUploaded"
    CustomButtonClassName="startbutton" ShowResetButton="false" 
    AppendPartialGuid="true" AllowedExtensions=".jpg;.png;"
    CustomExtensionMessage="Only .jpg and .png files are allowed." 
    InputFileClassName="customfileupload" Visible=false
    FileTooLargeMessage=@FileTooLargeMessage>
</FileUpload>

请注意AllowedExtensions和CustomExtensionMessage的两个属性。

这是我处理FileUploaded的代码的相关部分:

// Create a new instance of a 'FileInfo' object.
FileInfo fileInfo = new FileInfo(file.Name);

// I don't know if it's even possible for an extension to be upper case
uploadedFileInfo.Extension = fileInfo.Extension.ToLower();

// if FilterByExtension is true and the AllowedExtensions text exists
if ((FilterByExtension) && (!String.IsNullOrWhiteSpace(AllowedExtensions)))
{
    // verify the extension exists
    if (!String.IsNullOrWhiteSpace(fileInfo.Extension))
    {
        // If the allowed extensions // fixed issue where uploading 
        abort = !AllowedExtensions.ToLower().Contains(fileInfo.Extension.ToLower());
    }
    else
    {
        // you must have an extension
        abort = true;
    }
}

也许这会给您一些想法。

如果您想看到一个使用它的实时站点,我几天前就发布了它: https ://pixeldatabase.net-使用BQL编辑图像-位图查询语言