Image Crash

[Fillipe Barbosa]

Good night,

I`m trying to paste a text with image on a RTE, but i tried all examples and it does not work in my application test, only in a demo page.

I have to paste the test with image inside from word and save all like a text using image base64 on database, thats my code, that i found here on forum.

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
@using Syncfusion.EJ2.Navigations;
 
@using Syncfusion.EJ2;
@using Syncfusion.EJ2.Popups;
@using Syncfusion.EJ2.DropDowns;
 
 
<div class="control-section">
    <div class="control-wrapper">
        <div class="control-section">
            @Html.EJS().RichTextEditor("default").Value((string)ViewBag.value).ActionComplete("actionComplete").Render()
        </div>
    </div>
</div>
<script>
    function actionComplete(args) {
        if (args.requestType == "Image") {
            imgelement = args.elements[0];
            toBase64(imgelement.src, function (dataUrl) {
                imgelement.setAttribute('src', dataUrl)
            })
        }
    }
    function toBase64(url, callback) {
        var httpRequest = new XMLHttpRequest();
        httpRequest.onload = function () {
            var fileReader = new FileReader();
            fileReader.onloadend = function () {
                callback(fileReader.result);
            }
            fileReader.readAsDataURL(httpRequest.response);
        };
        httpRequest.open('GET', url);
        httpRequest.responseType = 'blob';
        httpRequest.send();
    }
</script>
<style>
    .e-richtexteditor .e-rte-srctextarea {
        max-width: none;
    }
</style>

Attachment: chrome_axG7kaiHqD_4eae1fd1.zip

[Pandiyaraj Muniyandi]

Hi Fillipe, 

 

Greetings from Syncfusion support. 

 

We have validated your query and the saving image as base64 format feature included in Rich Text Editor from version 17.2.0.41. This is will resolve the reported issue from your end. 

 

Now you can enable this functionality by configuring SaveFormat API as Base64 in InsertImageSettings API as follows 

 

API: https://help.syncfusion.com/cr/aspnetmvc-js2/Syncfusion.EJ2.RichTextEditor.RichTextEditorImageSettings.html#Syncfusion_EJ2_RichTextEditor_RichTextEditorImageSettings_SaveFormat 

 

 

@Html.EJS().RichTextEditor("RTE").InsertImageSettings(obj => obj.SaveFormat(Syncfusion.EJ2.RichTextEditor.SaveFormat.Base64)).Render() 

 

 

We have prepared sample for your reference, get it from below link 

https://www.syncfusion.com/downloads/support/forum/156231/ze/RTE-1028593214 

 

Can you confirm whether above shared sample meets your requirement? 

 

Note: Generally, base64 string not suitable for larger size image, it will crash the web page. 

 

Regards, 

Pandiyaraj