CKEditor Upload Image plugin How to replace base64 with URL in SRC attribute of image

Viewed 285

I'm trying to use the Upload Image CKEditor plugin link to upload pasted image in the ditor with a custom upload method, because I don't want to save the text with all the base6 image data, that make the data to save too long, and replace the data with the URL of the uploaded image. I have a custom method that uploads the image and return a URL of a webmethod to call to get the image. In my custom upload method, I return a json object the the URL, , it works and uploads the image, but in the src attribute I still have the base64 data. Ths is the CKEDitor configuration in my javascript file

CKEDITOR.replace('DESC_ARTICLEANSWER', {
  language: editorlang,
  toolbar: 'helpsi',
  skin: 'moono',
  filebrowserBrowseUrl: '/browser/browse.php',
  filebrowserImageBrowseUrl: '/browser/browse.php?type=Images',
  filebrowserUploadUrl: '../Common/uploadHandler.ashx?upload_type=img_ckeditor',
  filebrowserImageUploadUrl: '../Common/uploadHandler.ashx?upload_type=img_ckeditor&CKEditorFuncNum=1&codeSiteId=' + $('#site').val()
});

And this is my custom method in uploadHandler.ashx file:

if ((context.Request.Form["upload_type"] == "img_ckeditor") || (context.Request.QueryString["upload_type"] == "img_ckeditor"))
{
  string _atchHTML = ProcessImageCKEditor(context);
  context.Response.Write(_atchHTML);
}
    
private string ProcessImageCKEditor(HttpContext context)
{
  string _atchHTML = "";
  try
  {

    string uploadpath = helpsi.framework.core.Configurator.Instance.getAppSettingsValue("APP_REQUEST_ATTACH_PATH");
    if (!uploadpath.StartsWith("\\"))
    {
        uploadpath = context.Server.MapPath(uploadpath);
    }
    string file = context.Request.Files[0].FileName;
    string ext = Path.GetExtension(file);
    string fileName = Guid.NewGuid().ToString() + ext;
    string filetoupload = Path.Combine(uploadpath, fileName);

    HttpPostedFile uploads = context.Request.Files["upload"];
    string CKEditorFuncNum = context.Request["CKEditorFuncNum"];

    uploads.SaveAs(filetoupload);
    string url = "../Common/GetAttachment.aspx?uploadedImage=1&FileName=" + fileName;
    _atchHTML = "{\"uploaded\": 1, \"fileName\": \"" + fileName + "\", \"url\": \"" + url + "\"}";


  }
  catch (Exception ex)
  {
     _atchHTML = "ERROR:" + ex.Message;
  }
  return _atchHTML;

}

The upload method is called and it runs successfully, the image is saved, but when it returns, in the pasted image in the editor there is still the base64 data string, and not the url obtained with save. What am I missing? In console I have this error, relative to the widget plugin.js file, in this function

function getFirstTextNode( el ) {
    return el.find( function( node ) {
        return node.type === 3;
    }, true ).shift();
}

Uncaught TypeError: el.find is not a function

0 Answers
Related