HTMLEditor - Paste image and convert it "on the fly" to base64

So i'm working on a Blazor wasm support site that will be published to an Azure Static Web page and there is no real easy way to save files somewhere and I don't want to make a backend.

Is it possible to expose the the file in the OnPaste funtion in the HtmlEditorPasteEventArgs?
That way maybe you can upload the file in the browser and convert it to a base64 directly?

Or is that impossible?

That would have solved a lot of issues when you don't have a backend where you can temporarily save the file.

This is probably doable but the RadzenHtmlEditor does not support it at the moment. We can probably add it as a built-in feature if the Upload url isn't configured.

That would be great, since the Azure Static Web does not have a "temp file" area to use for an upload url.

The current eidtor i'm using is TinyMCE and I'm having some huge performance issues with it and it uses a IFrame for the editor and i'm not really happy with it and the only thing that is kind of holding me back from using Radzen is the function to Paste a image so if it is possible to some how catch the pasted image in the OnPaste event so I can convert it to a Base64 in the client I think I'll switch over to Radzen for the whole project.
I have just started using Radzen and I really like it and I might even switch to it in some of my other project too.

Hi, was this ever implemented? I am trying to achieve something similar (provide the user the ability to paste inline pics/screenshots in). Thanks!

I just implemented it - images will be pasted as data URI if the UploadUrl property of RadzenHtmlEditor is not set. This will go live with the next release of Radzen.Blazor (probably later this week).

1 Like

Hi korchev,
is something changed or do you have reduced the limit of size of the pasted image?

If I paste a very little snapshot it works ok, but as soon the image is a little bigger (but not giant, just 800x600) the blazor server app disconnects for a few second and often you loose what you're doing (it's like it make a refresh/post in the old times of webforms without saving)

See video:


You might need this:

1 Like

Works perfect thanks!!

Forgot to mention that mine is a Blazor Server NET7 app but added to

    .AddHubOptions(o =>
    o.MaximumReceiveMessageSize = 10 * 1024 * 1024;
}); ;