Question

CKEditor图像上传不起作用，下面是代码

<CKEditor
                    editor={ ClassicEditor }
                    data={this.state.miscNotesData.miscnote}
                    onInit={ editor => {
                        // You can store the "editor" and use when it is needed.
                        console.log( 'Editor is ready to use!', editor );
                    } }
                    onChange={ ( event, editor ) => {
                        const data = editor.getData();
                        this.handleChange(data);
                        console.log( { event, editor, data } );
                    } }

                />

错误：

  backend.js:6 filerepository-no-upload-adapter: Upload adapter is not defined. 
Read more: https://ckeditor.com/docs/ckeditor5/latest/framework/guides/support/error-codes.html#error-filerepository-no-upload-adapter

here

Answer 1

如文档https://ckeditor.com/docs/ckeditor5/latest/features/image-upload/image-upload.html中所述在CKEDitor中有4种上传图像的选项：Easy Image（专有），CKFinder（PHP或ASP.net上的需要连接器），Simple适配器，Base64适配器

为此，我将简单适配器用于Node js服务器：

首先，我在ClassicEditor中安装了SimpleUploadAdapter，然后在CKEditor中设置了配置：

   <CKEditor
        data={input.value}
        editor={ ClassicEditor }
        config={{
          simpleUpload: {
            uploadUrl: 'https://myserver.herokuapp.com/image-upload'
          },
          toolbar: ['heading', '|', 'bold', 'italic', 'blockQuote', 'link', 'numberedList', 'bulletedList', 'imageUpload', 'insertTable',
            'tableColumn', 'tableRow', 'mergeTableCells', 'mediaEmbed', '|', 'undo', 'redo']
        }}
      />

并在我的服务器/ image-upload上创建url

React js：图片上传在CKEditor中不起作用

1 个答案: