I'm able to get the Quill delta content, but I cannot pass it to string through IJSRuntime.InvokeVoidAsync

I can see the exact delta object through console.log(), but I am unable to convert its object data into a string.

According to QuillJS documentation, which I'll quote:

getContents

Retrieves contents of the editor, with formatting data, represented by a Delta object.

Methods

getContents(index: number = 0, length: number = remaining): Delta

Examples

const delta = quill.getContents();

Therefore, on my Blazor web app, I needed to use IJSRuntime.InvokeVoidAsync<T> to get the delta object, which I had to convert to a string using JSON.stringify() first. Here's my relevant code snippet:

window.getContentsQuill = function () {    if (window.quillEditor) {        const delta = window.quillEditor.getContents();        console.log(delta);        return JSON.stringify(delta);    } else {        console.warn("Quill editor not initialized.");        return null;    }};

On Razor page:

@inject IJSRuntime JS@*Client-side code here*@@code {    private async Task GetDeltaObject()    {        string? modifiedContent = await JS.InvokeAsync<string>("getContentsQuill");        Console.WriteLine(modifiedContent);    }}

If I ran my project and then triggered the GetDeltaObject() method, it did nothing for a moment. After about 30 seconds, I got these logs:

warn: Microsoft.AspNetCore.Components.Server.Circuits.RemoteRenderer[100]      Unhandled exception rendering component: A task was canceled.      System.Threading.Tasks.TaskCanceledException: A task was canceled.         at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args)         at Microsoft.JSInterop.JSRuntimeExtensions.InvokeVoidAsync(IJSRuntime jsRuntime, String identifier, Object[] args)         at BlazorBootstrap.AutoComplete`1.DisposeAsyncCore(Boolean disposing)         at BlazorBootstrap.BlazorBootstrapComponentBase.DisposeAsync()         at Microsoft.AspNetCore.Components.RenderTree.Renderer.<ProcessDisposalQueueInExistingBatch>g__GetHandledAsynchronousDisposalErrorsTask|87_0(Task result)fail: Microsoft.AspNetCore.Components.Server.Circuits.CircuitHost[111]      Unhandled exception in circuit 'B_gf7YPeslmHNL-uNQ0u_OQ_7f_CFOcPvkwJAn1XFLo'.      System.Threading.Tasks.TaskCanceledException: A task was canceled.         at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args)         at Microsoft.JSInterop.JSRuntimeExtensions.InvokeVoidAsync(IJSRuntime jsRuntime, String identifier, Object[] args)         at BlazorBootstrap.AutoComplete`1.DisposeAsyncCore(Boolean disposing)         at BlazorBootstrap.BlazorBootstrapComponentBase.DisposeAsync()         at Microsoft.AspNetCore.Components.RenderTree.Renderer.<ProcessDisposalQueueInExistingBatch>g__GetHandledAsynchronousDisposalErrorsTask|87_0(Task result)

However, according to the answer in this thread (Blazor.NET: What causes "A task was canceled" within JavaScript), it seems the issue is that I'm exceeding SignalR's MaximumReceiveMessageSize limit. This is reasonable, as the delta object could be large and contain formatted text and images:

Delta object

{"ops": [    {"attributes": {"font": "roboto"      },"insert": "This is a sample full description with a list of images. - Roboto"    },    {"insert": "\nThis is a sample full description with a list of images. - Open Sans\n"    },    {"attributes": {"font": "lato"      },"insert": "This is a sample full description with a list of images. - Lato"    },    {"insert": "\n"    },    {"attributes": {"font": "montserrat"      },"insert": "This is a sample full description with a list of images. - Montserrat"    },    {"insert": "\nThis is a sample full description with a list of images. - Roboto Condensed\n"    },    {"attributes": {"font": "oswald"      },"insert": "This is a sample full description with a list of images. - Oswald"    },    {"insert": "\n"    },    {"attributes": {"font": "poppins"      },"insert": "This is a sample full description with a list of images. - Poppins"    },    {"insert": "\nThis is a sample full description with a list of images. - Slabo 27px\nThis is a sample full description with a list of images. - NotoSans\nThis is a sample full description with a list of images. - Roboto Mono\n"    },    {"attributes": {"font": "merriweather"      },"insert": "This is a sample full description with a list of images. - Merriweather"    },    {"insert": "\n\n"    },    {"insert": {"image": "data:image/png;base64,{image-data}"      }    },    {"insert": "\n\n"    },    {"insert": {"image": "data:image/png;base64,{image-data}"      }    },    {"insert": "\n\n"    },    {"insert": {"image": "data:image/png;base64,{image-data}"      }    },    {"insert": "\n"    }  ]}

Here's the DevTools' console log:

Moreover, according to the ASP.NET Core SignalR configuration documentation:

MaximumReceiveMessageSize

32 KB

Maximum size of a single incoming hub message. Increasing the value may increase the risk of Denial of service (DoS) attacks.

So my question is, how can I resolve this issue in the Blazor Web App (.NET 9) and get the Quill delta object, which will later be used to update the record in the database?