doc(Uploader): add UseUploaderStaticFiles extension method (#6382)

* doc: 更新资源文件

* doc(Uploader): add UseUploaderStaticFiles extension method

Author: ArgoZhang

src/BootstrapBlazor.Server/Components/Samples/UploadCards.razor.cs

@@ -3,8 +3,6 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang([email protected]) Website: https://www.blazor.zone
 
-using Newtonsoft.Json.Linq;
-
 namespace BootstrapBlazor.Server.Components.Samples;
 
 /// <summary>
@@ -50,7 +48,7 @@ private async Task OnCardUpload(UploadFile file)
             // 服务器端验证当文件大于 5MB 时提示文件太大信息
             if (file.Size > MaxFileLength)
             {
-                await ToastService.Information(Localizer["UploadsFileMsg"], Localizer["UploadsFileError"]);
+                await ToastService.Information(Localizer["UploadsFileTitle"], Localizer["UploadsFileError"]);
                 file.Code = 1;
                 file.Error = Localizer["UploadsFileError"];
             }
@@ -59,7 +57,7 @@ private async Task OnCardUpload(UploadFile file)
                 // 模拟保存成功
                 await Task.Delay(100);
                 await SaveToFile(file);
-                await ToastService.Success(Localizer["UploadsFileMsg"], $"{file.File!.Name} {Localizer["UploadsSuccess"]}");
+                await ToastService.Success(Localizer["UploadsFileTitle"], $"{file.File!.Name} {Localizer["UploadsSuccess"]}");
             }
         }
     }
@@ -87,10 +85,10 @@ private async Task SaveToFile(UploadFile file)
                 }
                 else
                 {
-                    var errorMessage = $"{Localizer["UploadsSaveFileError"]} {file.OriginFileName}";
+                    var errorMessage = Localizer["UploadsSaveFileError"];
                     file.Code = 1;
                     file.Error = errorMessage;
-                    await ToastService.Error(Localizer["UploadFile"], errorMessage);
+                    await ToastService.Error(Localizer["UploadsFileTitle"], errorMessage);
                 }
             }
             catch (OperationCanceledException)
@@ -102,7 +100,7 @@ private async Task SaveToFile(UploadFile file)
         {
             file.Code = 1;
             file.Error = Localizer["UploadsWasmError"];
-            await ToastService.Information(Localizer["UploadsSaveFile"], Localizer["UploadsSaveFileMsg"]);
+            await ToastService.Error(Localizer["UploadsFileTitle"], Localizer["UploadsWasmError"]);
         }
     }
 
@@ -111,9 +109,12 @@ private async Task SaveToFile(UploadFile file)
     /// </summary>
     public void Dispose()
     {
-        _token?.Cancel();
-        _token?.Dispose();
-        _token = null;
+        if (_token != null)
+        {
+            _token.Cancel();
+            _token.Dispose();
+            _token = null;
+        }
         GC.SuppressFinalize(this);
     }
 }

src/BootstrapBlazor.Server/Extensions/WebApplicationExtensions.cs

@@ -0,0 +1,23 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the Apache 2.0 License
+// See the LICENSE file in the project root for more information.
+// Maintainer: Argo Zhang([email protected]) Website: https://www.blazor.zone
+
+using Microsoft.Extensions.FileProviders;
+
+namespace Microsoft.AspNetCore.Builder;
+
+static class WebApplicationExtensions
+{
+    public static void UseUploaderStaticFiles(this WebApplication app)
+    {
+        var uploader = Path.Combine(app.Environment.WebRootPath, "images", "uploader");
+        Directory.CreateDirectory(uploader);
+
+        app.UseStaticFiles(new StaticFileOptions
+        {
+            FileProvider = new PhysicalFileProvider(uploader),
+            RequestPath = "/images/uploader"
+        });
+    }
+}

src/BootstrapBlazor.Server/Locales/en-US.json

@@ -3395,7 +3395,12 @@
     "UploadFileIconTemplateTitle": "Custom file icon",
     "UploadFileIconTemplateIntro": "By setting the <code>IconTemplate</code> parameter and using the <code>FileIcon</code> component, you can further customize the file icon <a href=\"/file-icon\">[FileIcon example]</a>",
     "UploadBase64Title": "Base64 format",
-    "UploadBase64Intro": "By setting the <code>PrevUrl</code> parameter value of the <code>UploadFile</code> instance, use the image content string in the <code>data:image/xxx;base64,XXXXX</code> format as the preview file path"
+    "UploadBase64Intro": "By setting the <code>PrevUrl</code> parameter value of the <code>UploadFile</code> instance, use the image content string in the <code>data:image/xxx;base64,XXXXX</code> format as the preview file path",
+    "UploadsFileTitle": "Upload",
+    "UploadsFileError": "The file is larger than 5M. Please reselect the file to upload.",
+    "UploadsSuccess": "File saved successfully",
+    "UploadsSaveFileError": "File save failed",
+    "UploadsWasmError": "In wasm mode, please call the api to save"
   },
   "BootstrapBlazor.Server.Components.Samples.UploadDrops": {
     "UploadsTitle": "DropUpload",

src/BootstrapBlazor.Server/Locales/zh-CN.json

@@ -3395,7 +3395,12 @@
     "UploadFileIconTemplateTitle": "自定义文件图标",
     "UploadFileIconTemplateIntro": "通过设置 <code>IconTemplate</code> 参数，使用 <code>FileIcon</code> 组件可以对文件图标进行进一步自定义 <a href=\"/file-icon\">[FileIcon 示例]</a>",
     "UploadBase64Title": "Base64 格式文件",
-    "UploadBase64Intro": "通过设置 <code>UploadFile</code> 实例的 <code>PrevUrl</code> 参数值使用 <code>data:image/xxx;base64,XXXXX</code> 格式图片内容字符串作为预览文件路径"
+    "UploadBase64Intro": "通过设置 <code>UploadFile</code> 实例的 <code>PrevUrl</code> 参数值使用 <code>data:image/xxx;base64,XXXXX</code> 格式图片内容字符串作为预览文件路径",
+    "UploadsFileTitle": "文件上传",
+    "UploadsFileError": "文件大于 5M 请重新选择文件上传",
+    "UploadsSuccess": "文件保存成功",
+    "UploadsSaveFileError": "文件保存失败",
+    "UploadsWasmError": "wasm 模式请调用 api 进行保存"
   },
   "BootstrapBlazor.Server.Components.Samples.UploadDrops": {
     "UploadsTitle": "DropUpload 拖拽上传组件",

src/BootstrapBlazor.Server/Program.cs

@@ -35,6 +35,9 @@
     app.UseExceptionHandler("/Error", createScopeForErrors: true);
 }
 
+// 增加上传目录静态资源文件
+app.UseUploaderStaticFiles();
+
 app.UseAntiforgery();
 app.UseBootstrapBlazor();