Интеграция Laravel Vue.js с CKeditor 4 и CKFinder3 (файловый менеджер) - PullRequest
Новая
       48

Интеграция Laravel Vue.js с CKeditor 4 и CKFinder3 (файловый менеджер)

0 голосов
/ 06 ноября 2018

У меня есть некоторые проблемы с интеграцией CKeditor 4 и CKFinder 3 в приложении My Laravel Vue .

Мне просто нужна функциональность, когда я нажимаю «кнопку с изображением» в моем Ckeditor - появляется окно CKFinder, и я могу загрузить все необходимые изображения.

Какие у меня проблемы? ( несколько, но они должны быть связаны друг с другом ):

  1. У меня есть эта ошибка в моей консоли devtools: "[CKEDITOR] Код ошибки: cloudservices-no-token-url." (Я полагаю, что проблема должна быть решена, когда я правильно интегрирую CKeditor с CKFinder)
  2. ( как WARN в devtools ) - "[CKEDITOR] Код ошибки: редактор-плагин-конфликт. {Плагин:" изображение ", replaceWith:" easyimage "}"
  3. «Кнопка изображения» в моем CKeditor исчезла (скриншот ckeck ниже): enter image description here

Вы можете увидеть мой код компонента Vue с config для ckeditor: 

...
 export default {
    components: { VueCkeditor },
    data() {
        return {
            content: '',
            config: {
                toolbar: [
                    { name: 'styles', items : [ 'Styles','Format', 'FontSize' ] },
                    { name: 'clipboard', items : ['Undo','Redo' ] },
                    { name: 'editing', items : [ 'Scayt' ] },
                    { name: 'insert', items : [ 'Image','Table','HorizontalRule','SpecialChar','Iframe' ] },
                    { name: 'tools', items : [ 'Maximize' ] },
                    '/',
                    { name: 'basicstyles', items : [ 'Bold','Italic','Strike','RemoveFormat' ] },
                    { name: 'paragraph', items : [ 'NumberedList','BulletedList','-','Outdent','Indent','-','Blockquote' ] },
                    { name: 'links', items : [ 'Link','Unlink','Anchor' ] },
                ],
                height: 400,
                extraPlugins: 'autogrow,uploadimage',
                filebrowserBrowseUrl: '/filemanager_storage?type=Files',
                filebrowserUploadUrl: '/filemanager_storage/upload?type=Files&_token='+window.Laravel.csrfToken,
            },

        };
    },
...

Другие детали, которые могут быть полезны:

  1. Я использую CKFinder 3 Package для Laravel 5.5+ (https://github.com/ckfinder/ckfinder-laravel-package)

  2. В моем ckfinder.php (конфигурации для CKFinder) я временно установил этот код: 

     $config['authentication'] = function () {
   return true;
 };

  3. Я не уверен в этих путях (в моем объекте конфигурации в vue): 

      filebrowserBrowseUrl: '/filemanager_storage?type=Files',
  filebrowserUploadUrl: '/filemanager_storage/upload?type=Files&_token='+window.Laravel.csrfToken,
    },

* Я создал каталог 'filemanager_storage' в моем 'публичном' каталоге

Спасибо, ребята, за любую помощь!

...