Merge pull request #85 from S-Luiten/feature/#83

Add GetHTMLAsStream method.
Blazored · Jan 3, 2025 · feeb008 · feeb008
2 parents 40e0757 + c4b83a8
commit feeb008
Show file tree

Hide file tree

Showing 8 changed files with 58 additions and 4 deletions.
diff --git a/README.md b/README.md
@@ -88,6 +88,7 @@ Below is a list of all the options available on the Text Editor.
 
 - `GetText` - Gets the content of the editor as Text.
 - `GetHTML` - Gets the content of the editor as HTML.
+- `GetHTMLAsStream` - Gets the content of the editor as HTML stream (requires .NET 6.0 or later).
 - `GetContent` - Gets the content of the editor in the native Quill JSON Delta format.
 - `LoadContent` (`json`) - Allows the content of the editor to be programmatically set.
 - `LoadHTMLContent` (`string`) - Allows the content of the editor to be programmatically set.

diff --git a/samples/BlazorServerSide/BlazorServerSide.csproj b/samples/BlazorServerSide/BlazorServerSide.csproj
@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Web">
 
   <PropertyGroup>
-    <TargetFramework>netcoreapp3.1</TargetFramework>
+    <TargetFrameworks>netcoreapp3.1;net6.0</TargetFrameworks>
   </PropertyGroup>
 
   <ItemGroup>

diff --git a/samples/BlazorServerSide/Pages/Index.razor b/samples/BlazorServerSide/Pages/Index.razor
@@ -27,6 +27,7 @@
         </span>
         <span class="ql-formats">
             <button class="ql-link"></button>
+            <button class="ql-image"></button>
         </span>
     </ToolbarContent>
     <EditorContent>
@@ -224,9 +225,26 @@ console.<span class="hljs-built_in">log</span>("I love " <span class="hljs-opera
 
         try
         {
+#if NET6_0_OR_GREATER
+            await using var streamReference = await this.QuillHtml.GetHTMLAsStream(cts.Token);
+
+            const long MaxAllowedSize = 5_000_000; // 5MB
+
+            if (streamReference.Length > MaxAllowedSize)
+            {
+                QuillHTMLContent = $"<p>ERROR: Maximum allowed size exceeded ({streamReference.Length} / {MaxAllowedSize})</p>";
+            }
+            else
+            {
+                using var stream = await streamReference.OpenReadStreamAsync(MaxAllowedSize, cts.Token);
+                using var streamReader = new StreamReader(stream);
+                QuillHTMLContent = await streamReader.ReadToEndAsync().WaitAsync(cts.Token);
+            }
+#else
             QuillHTMLContent = await this.QuillHtml.GetHTML(cts.Token);
+#endif
         }
-        catch (TaskCanceledException e)
+        catch (TaskCanceledException)
         {
             QuillHTMLContent = "<p>ERROR: Timeout</p>";
         }

diff --git a/samples/BlazorServerSide/_Imports.razor b/samples/BlazorServerSide/_Imports.razor
@@ -1,4 +1,5 @@
-@using System.Net.Http
+@using System.IO
+@using System.Net.Http
 @using System.Threading
 @using Microsoft.AspNetCore.Authorization
 @using Microsoft.AspNetCore.Components.Authorization

diff --git a/src/Blazored.TextEditor/Blazored.TextEditor.csproj b/src/Blazored.TextEditor/Blazored.TextEditor.csproj
@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <TargetFramework>netstandard2.0</TargetFramework>
+    <TargetFrameworks>netstandard2.0;net6.0</TargetFrameworks>
     <RazorLangVersion>3.0</RazorLangVersion>
     <RootNamespace>Blazored.TextEditor</RootNamespace>
 
@@ -34,6 +34,10 @@
     <PackageReference Include="Microsoft.AspNetCore.Components" Version="3.1.0" />
     <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="3.1.0" />
   </ItemGroup>
+
+  <ItemGroup Condition="'$(TargetFramework)'=='net6.0'">
+    <PackageReference Include="Microsoft.JSInterop" Version="6.0.36" />
+  </ItemGroup>
 
   <ItemGroup>
     <None Include="wwwroot\Blazored-BlazorQuill.js" />

diff --git a/src/Blazored.TextEditor/BlazoredTextEditor.razor b/src/Blazored.TextEditor/BlazoredTextEditor.razor
@@ -124,6 +124,20 @@
             JSRuntime, QuillElement, cancellationToken);
     }
 
+#if NET6_0_OR_GREATER
+    public async Task<IJSStreamReference> GetHTMLAsStream()
+    {
+        return await Interop.GetHTMLAsStream(
+            JSRuntime, QuillElement);
+    }
+
+    public async Task<IJSStreamReference> GetHTMLAsStream(CancellationToken cancellationToken)
+    {
+        return await Interop.GetHTMLAsStream(
+            JSRuntime, QuillElement, cancellationToken);
+    }
+#endif
+
     public async Task<string> GetContent()
     {
         return await Interop.GetContent(

diff --git a/src/Blazored.TextEditor/Interop.cs b/src/Blazored.TextEditor/Interop.cs
@@ -46,6 +46,19 @@ internal static ValueTask<string> GetHTML(
                 quillElement);
         }
 
+#if NET6_0_OR_GREATER
+        internal static ValueTask<IJSStreamReference> GetHTMLAsStream(
+            IJSRuntime jsRuntime,
+            ElementReference quillElement,
+            CancellationToken cancellationToken = default)
+        {
+            return jsRuntime.InvokeAsync<IJSStreamReference>(
+                "QuillFunctions.getQuillEncodedHTML",
+                cancellationToken,
+                quillElement);
+        }
+#endif
+
         internal static ValueTask<string> GetContent(
             IJSRuntime jsRuntime,
             ElementReference quillElement,

diff --git a/src/Blazored.TextEditor/wwwroot/Blazored-BlazorQuill.js b/src/Blazored.TextEditor/wwwroot/Blazored-BlazorQuill.js
@@ -33,6 +33,9 @@
         getQuillHTML: function(quillElement) {
             return quillElement.__quill.root.innerHTML;
         },
+        getQuillEncodedHTML: function(quillElement) {
+            return new TextEncoder().encode(quillElement.__quill.root.innerHTML);
+        },
         loadQuillContent: function(quillElement, quillContent) {
             content = JSON.parse(quillContent);
             return quillElement.__quill.setContents(content, 'api');