лучший способ для управления загруженными файлами в моем редакторе? - PullRequest
0 голосов
/ 10 октября 2018

Я работаю над социальным блогом, в котором есть встроенный редактор javascript для создания блога пользователем.одна из моих самых больших проблем - загрузка файлов и их ограничение.прямо сейчас для автоматического сохранения пользовательских сообщений я храню изображения, загруженные одновременно на сервер, но проблема заключается в том, что пользователь удалил изображения из редактора, поскольку:

  • Количество запросов может быть слишком большим (даже еслиесть бот)
  • В Ckeditor у меня есть процедура для загрузки, но нет возможности удалить ее с сервера (или, по крайней мере, я не знаю, как)
  • и, наконец, это хорошоидея для автосохранения (?)

Мой редактор - это настроенная версия ckeditor5, а для загрузки файлов я использую адаптер загрузки, например:

export default class UploadAdapter {
    constructor(loader, article) {
        this.loader = loader;
        this.article = article;
    }
    upload() {
        return new Promise((resolve, reject) => {
            let image = new FormData();
            let url = '/articles/imageUpload';
            image.append('upload', this.loader.file);
            image.append('token', this.article.token);

            axios.post(url, image)
                .then(response => {
                    console.log(response);
                    if (response.data.uploaded) {
                        resolve({
                            default: response.data.url,
                        });
                    }
                    else {
                        reject(response.data.error.message);
                    }
                }).catch(error => {
                console.log(error);
            });
        });
    }
}

Ответы [ 2 ]

0 голосов
/ 19 марта 2019

Я использовал ниже для встраивания изображений в качестве base64 вместо загрузки их

class UploadAdapter {
   constructor( loader ) {
      this.loader = loader;
   }

   upload() {
      return this.loader.file
            .then( file => new Promise( ( resolve, reject ) => {
                  var myReader= new FileReader();
                  myReader.onloadend = (e) => {
                     resolve({ default: myReader.result });
                  }

                  myReader.readAsDataURL(file);
            } ) );
   };
}
0 голосов
/ 07 ноября 2018

Не знаю, поможет вам это или нет.Но я использовал для решения этой проблемы удаления изображения следующим образом.

Я использовал summernote редактор.

Шаги, которые я выполнял при вставке изображений с другимиСодержание:

Собраны все изображения из редактора

$images = $dom->getelementsbytagname('img');

Здесь я получаю изображения в виде base64.вот почему мне нужно было их декодировать и хранить отдельно

$imagePaths = [];
foreach($images as $k => $img){
        $data = $img->getattribute('src');
        $check_image = substr($data,0,10);
        if($check_image != "data:image"){
            continue;
        }
        list($type, $data) = explode(';', $data);
        list(, $data)      = explode(',', $data);
        $data = base64_decode($data);
        $image_name = time().$k.'.png';
        $path = public_path("/").ImagePaths::$BLOG_DETAILS_PICTURE.'/'.$image_name;
        file_put_contents($path, $data);
        $img->removeattribute('src');
        $img->setattribute('src', asset(ImagePaths::$BLOG_DETAILS_PICTURE.'/'.$image_name));
        $imagePaths[] = $path; // This path for store in DB
    }

Когда я удаляю или обновляю контент, я просто удаляю все изображения, которые я получил в массиве $imagePaths ранее и сохранил.

Когда я работал над этим, я следовал этой документации

Здесь я поделился полным сценарием контроллера.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...