feat(ClipboardService): add getText method (#3775)

* add getTextFromClipboard function

* feat: 更新剪切板服务

* doc: 增加注释

* doc: 更新文档

* doc: 更新文档

* doc: 更新示例文档

* test: 更新单元测试

---------

Co-authored-by: Argo-AscioTech <argo@live.ca>

src/BootstrapBlazor.Server/Components/Samples/Clipboards.razor

@@ -5,14 +5,18 @@
     <Pre>[Inject]
 [NotNull]
 private ClipboardService? ClipboardService { get; set; }
-
-private void Copy()
+private async Task Copy()
 {
-    ClipboardService.Copy(content);
+    await ClipboardService.Copy(content);
+}
+private async Task GetText()
+{
+    var txt = await ClipboardService.GetText();
 }</Pre>
     <BootstrapInputGroup>
         <BootstrapInput @bind-Value="@content" />
         <Button Text="Copy" OnClick="@Copy" />
+        <Button Color="Color.Warning" Text="Get" OnClick="@Get" />
     </BootstrapInputGroup>
 </DemoBlock>
 

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

@@ -22,18 +22,34 @@ public partial class Clipboards
     private async Task Copy()
     {
         await ClipboardService.Copy(content);
-
         await ToastService.Success("Clipboard", Localizer["ClipboardMessage", content]);
     }
 
+    private async Task Get()
+    {
+        var text = await ClipboardService.GetText();
+        if (!string.IsNullOrEmpty(text))
+        {
+            content = text;
+            await ToastService.Success("Clipboard", Localizer["ClipboardGetTextMessage", text]);
+        }
+    }
+
     private MethodItem[] GetMethods() =>
     [
         new()
         {
             Name = "Copy",
-            Description = Localizer["ClipboardIntro"],
+            Description = Localizer["ClipboardCopyMethod"],
             Parameters = " — ",
             ReturnValue = "Task"
+        },
+        new()
+        {
+            Name = "GetText",
+            Description = Localizer["ClipboardGetTextMethod"],
+            Parameters = " — ",
+            ReturnValue = "Task<string?>"
         }
     ];
 }

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

@@ -6322,7 +6322,10 @@
   "BootstrapBlazor.Server.Components.Samples.Clipboards": {
     "ClipboardTitle": "ClipboardService",
     "ClipboardIntro": "Clipboard service! Please note that it can only be run under <code>HTTPS</code> secure connections or used in the localhost development environment.",
-    "ClipboardMessage": "Text content: {0}, copied to clipboard"
+    "ClipboardMessage": "Text content: {0}, copied to clipboard",
+    "ClipboardGetTextMessage": "Read clipboard text content: {0}",
+    "ClipboardCopyMethod": "Copy text to the clipboard method",
+    "ClipboardGetTextMethod": "Method for reading clipboard text content"
   },
   "BootstrapBlazor.Server.Components.Samples.Gantts": {
     "Title": "A simple, interactive, modern web Gantt gallery with dragging, resizing, dependencies, and timescales",

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

@@ -6322,7 +6322,10 @@
   "BootstrapBlazor.Server.Components.Samples.Clipboards": {
     "ClipboardTitle": "ClipboardService",
     "ClipboardIntro": "剪切板服务！请注意，只能在 <code>HTTPS</code> 安全连接下运行，或者在本地 <code>localhost</code> 开发环境中使用",
-    "ClipboardMessage": "文本内容：{0}, 已复制到剪切板"
+    "ClipboardMessage": "文本内容：{0}, 已复制到剪切板",
+    "ClipboardGetTextMessage": "读取剪切板文本内容: {0}",
+    "ClipboardCopyMethod": "拷贝文本到剪切板方法",
+    "ClipboardGetTextMethod": "读取剪切板文本内容方法"
   },
   "BootstrapBlazor.Server.Components.Samples.Gantts": {
     "Title": "一个简单、交互式、现代的 Web 甘特图库，具有拖动、调整大小、依赖关系和时间刻度",

src/BootstrapBlazor/Components/Clipboard/Clipboard.cs

@@ -26,6 +26,7 @@ public class Clipboard : BootstrapModuleComponentBase
 
         // 注册 ClipboardService 弹窗事件
         ClipboardService.Register(this, Copy);
+        ClipboardService.RegisterGetText(GetText);
     }
 
     private async Task Copy(ClipboardOption option)
@@ -38,6 +39,12 @@ public class Clipboard : BootstrapModuleComponentBase
         }
     }
 
+    /// <summary>
+    /// 读取剪切板拷贝文字方法
+    /// </summary>
+    /// <returns></returns>
+    private Task<string?> GetText() => InvokeAsync<string?>("getTextFromClipboard");
+
     /// <summary>
     /// Dispose 方法
     /// </summary>
@@ -47,6 +54,7 @@ public class Clipboard : BootstrapModuleComponentBase
         if (disposing)
         {
             ClipboardService.UnRegister(this);
+            ClipboardService.UnRegisterGetText();
         }
         await base.DisposeAsync(disposing);
     }

src/BootstrapBlazor/Components/Clipboard/ClipboardService.cs

@@ -9,6 +9,46 @@ namespace BootstrapBlazor.Components;
 /// </summary>
 public class ClipboardService : BootstrapServiceBase<ClipboardOption>
 {
+    /// <summary>
+    /// 获得 回调委托缓存集合
+    /// </summary>
+    private readonly List<(string Key, Func<Task<string?>> Callback)> _callbackCache = [];
+
+    private const string GetTextKey = "getText";
+
+    /// <summary>
+    /// 注册回调方法
+    /// </summary>
+    /// <param name="callback"></param>
+    internal void RegisterGetText(Func<Task<string?>> callback)
+    {
+        _callbackCache.Add((GetTextKey, callback));
+    }
+
+    /// <summary>
+    /// 注销回调方法
+    /// </summary>
+    internal void UnRegisterGetText()
+    {
+        var item = _callbackCache.FirstOrDefault(i => i.Key == GetTextKey);
+        if (item.Key != null) _callbackCache.Remove(item);
+    }
+
+    /// <summary>
+    /// 获得剪切板拷贝文字方法
+    /// </summary>
+    /// <returns></returns>
+    public async Task<string?> GetText()
+    {
+        string? ret = null;
+        var (Key, Callback) = _callbackCache.FirstOrDefault(i => i.Key == GetTextKey);
+        if (Key != null)
+        {
+            ret = await Callback();
+        }
+        return ret;
+    }
+
     /// <summary>
     /// 拷贝方法
     /// </summary>

src/BootstrapBlazor/Services/BootstrapServiceBase.cs

@@ -5,7 +5,7 @@
 namespace BootstrapBlazor.Components;
 
 /// <summary>
-/// 
+/// BootstrapServiceBase 基类
 /// </summary>
 public abstract class BootstrapServiceBase<TOption>
 {

src/BootstrapBlazor/wwwroot/modules/utility.js

@@ -56,6 +56,10 @@ const copy = (text = '') => {
     }
 }
 
+const getTextFromClipboard = () => {
+    return navigator.clipboard.readText();
+}
+
 const getUID = (prefix = 'bb') => {
     let id = "";
     do {
@@ -760,6 +764,7 @@ export {
     addLink,
     addScript,
     copy,
+    getTextFromClipboard,
     debounce,
     drag,
     insertBefore,

test/UnitTest/Services/ClipboardTest.cs

@@ -21,6 +21,7 @@ public class ClipboardServiceTest : BootstrapBlazorTestBase
         });
         Assert.True(copied);
 
+        var text = await service.GetText();
         await cut.Instance.DisposeAsync();
     }
 }