CKFinder 'File upload is not allowed' message when trying to upload

228 views Asked by At

I'm trying out the demo of CKEditor with CKFinder in Angular, and I got the CKFinder module running. When I open the file manager modal in the editor, I get to see a bunch of pictures of which I have no idea where they come from; and when I drop an image file into the modal I see an alert saying 'File upload is not allowed'. I must be missing some configuration, and I've spent over a day getting this to work, but the documentation is such a vague messy place that I can't figure out how to make this work. Other CKFinder issues here on SO seem to be mostly related to their server configuration.

My code looks as follows:

// app.component.ts
import CKEditor from '@ckeditor/ckeditor5-build-decoupled-document';

...

editor = CKEditor;
config = {
    licenseKey: '<trial token>',
    ckfinder: {
        uploadUrl: '/app/server.js'
    },
    toolbar: ['bold', 'italic', '|', 'link', '|', 'undo', 'redo', 'CKFinder']
}


onReady = (editor: CKEditor): void => {
    const element = editor.ui.getEditableElement()!;
    const parent = element.parentElement!;

    parent.insertBefore(editor.ui.view.toolbar.element!, element);
}
// app.component.html
<ckeditor
  [editor]="editor"
  [config]="config"
  (ready)="onReady($event)"
></ckeditor>

I've tried a lot of things, such as:

  • using a custom adapter (not sure if this is necessary at all), but the upload function in it is never even triggered;
  • adding plugins: [CKFinder] to the config object, but this breaks the application (many 'incorrect token' errors in svg files).

Please note that this message comes from CKEditor itself, as no attempt to communicate with a server is made. The provided uploadUrl is therefore irrelevant, I think.

0

There are 0 answers