Adding images per drag&drop or from clipboard in CKEditor fails

Since update to V. 14.4, when images are inserted in edit mode via drag & drop or from the clipboard, they are uploaded as attachments but are no longer displayed after the page is saved. The reason is an incorrect URL to the image source: the entire path is appended to the path in URL-coded form, which leads to the error.

Example: The path for an image added via drag&drop is

  • src="/ikmz/xwiki/bin/download/Fehler-Datenbank/Bild-Fehler/WebHome/%2Fikmz%2Fxwiki%2Fbin%2Fdownload%2FFehler-Datenbank%2FBild-Fehler%2FWebHome%2Fimage-20220616084930-1.png?width=1920&height=1080"

when it shoud be

  • src="/ikmz/xwiki/bin/download/Fehler-Datenbank/Bild-Fehler/WebHome/image-20220616084930-1.png?width=1920&height=1080"

Uploading or adding images using the image dialogue works fine, however.

Emptying browser caches doesn’t fix the problem. Has anyone experienced the same problem? What are we doing wrong?

Hi, we changed the way the attachments are uploaded since 14.4 (see https://www.xwiki.org/xwiki/bin/view/ReleaseNotes/Data/XWiki/14.3RC1/#HMiscellaneous).
Now I never reproduced such problem, could you give some more details about your configuration: which servlet engine are you using? Do you use a specific URL configuration? Are you using XWiki behind a proxy that could rewrite URLs?

Could you open the Network tab from the browser’s developer tools and filter by “FileUploader”. Then drop a file and check the JSON response. Is the value of the url field right?

@mflorea The json response is this:

  • {“uploaded”:1,“fileName”:“image-20220616103935-1.jpeg”,“url”:"/ikmz/xwiki/bin/download/Fehler-Datenbank/Bild-Fehler/WebHome/image-20220616103935-1.jpeg",“resourceReference”:{“type”:“attach”,“reference”:“image-20220616103935-1.jpeg”}}

Seems right to me

We use tomcat-9.0.63, we have set “xwiki.webapppath=ikmz/xwiki” and deployed to ikmz#xwiki, the installation is behind a reverse proxy without url rewriting ( Apache: RewriteRule ^/ikmz/xwiki/(.*) ajp://xwiki-ikmz.b-tu.de:8009/ikmz/xwiki/$1 [NC,P].

Thanks, I’ll try to check a bit more with your options. Can you confirm the following:

  1. The image appears properly in the editor after the drag&drop
  2. You’re getting same behaviour with the in-place editor (when you click on edit and it shows the editor immediately without loading a page) and in the standard WYSIWYG editor (displayed when you create a new page)
  3. When you save, the attachment is properly added, it’s just the src of the image which is wrong

Can you try disabling the new temporary attachment feature by performing the following: you go in Administration > Editing > WYSIWYG Editor, and in Advanced configuration you put:
config['xwiki-upload'].isTemporaryAttachmentSupported = false;

Then try again to drag&drop a picture in a page (maybe perform a force reload of the editor to be sure the config is taken into account). Let me know if it’s working better or not.

1 Like

I can confirm this.

As to your suggestion: Disabling the temporary attachment feature does not fix the problem.

I’ve found the same issue after updating to 14.4.1. the change above resolved the issue for me.

Using Tomcat9, Short URLS with URL re-write as per Short URLs.

We do have an open issue about the upload of attachment with short URL, you can check it here: [XWIKI-19444] Uploading an attachment fails when using short URLs - XWiki.org JIRA

I can confirm this now, too.For this to work, I have to re-enable the plugin wiki-upload again, which I had disabled because it causes an upload error ckeditor.upload.error.emptyreturn.
So my setup is now:

  • wiki-upload => enabled
  • config[‘xwiki-upload’].isTemporaryAttachmentSupported = false;

This solves the problem for now.

Is your wiki also configured to use short URLs?

No, we don’t use short URLs, as far as I know (see quote)