Блог

FilePond.revert не передает уникальные файлы идентификаторов контроллеру laravel.

Как удалить загруженный файл по идентификатору?

FilePond JS

 var csrf = $('meta[name="csrf-token"]').attr('content'); 

    FilePond.setOptions({
        server: {
            url: '/file/upload/',
            process: {
                url: 'process',
                headers: {
                    'X-CSRF-TOKEN': csrf
                },
                onload: function (responce) {
                    console.log(JSON.parse(responce))
                },
            },
            revert: {
                url: 'revert',
                headers: {
                    'X-CSRF-TOKEN': csrf
                },
                onload: function (x) {

                    // X - empty, why????
                    console.log(x)

                },
            },
            load: {
                url: 'load/',
            },
        },
    })

    FilePond.create(document.querySelector('.filepond[type="file"]'), {
        files: [
            {
                source: '11',
                options: {
                    type: 'local',
                }
            },
        ]
    });
  

Загрузка изображений выполняется успешно.
Возвращает уникальный идентификатор файла в ответ.

 public function process(){

        $file = FilesUploadService::save();

        return response($file->collection->id, 200)
            ->header('Content-Type', 'text/plain');
    }
  

Пустой здесь я не могу найти идентификатор файла. Которые необходимо удалить

 public function revert(Request $request){
        return response()->json($request->all());
    }
  

Кто-нибудь все еще борется:

request->getContent() вернет полезную нагрузку запроса, отправленную filepond.

В методе revert в контроллере:

 public function revert(Request $request){
     $fileId = request()->getContent();
     //use $fileId to delete file from filesystem
}
  

onload Приведенный ниже метод должен возвращать FilePond уникальный идентификатор. Так, например, если уникальный идентификатор найден в responce.id , вы добавляете строку возврата, как показано.

 onload: function (responce) {
    console.log(JSON.parse(responce))
    return JSON.parse(responce).id // added
},
  

Вы заставили это работать? FilePond использует DELETE заголовок при возврате, возможно, поэтому вы ничего не получаете от запроса.

Может быть, что-то вроде этого?

 public function revert(){
    $response = new stdClass();
    if ($_SERVER['REQUEST_METHOD'] === 'DELETE') {
    $file_name = strip_tags(file_get_contents("php://input"));
        if (is_string($file_name) amp;amp; FilesUploadService::delete($file_name)) {
            $response->id = $file_name;
            $response->success = true;
        } else {
            $response = false;
        }
    } else {
        $response = false;
    }
    return response()->json($response);
}
  

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

На вашей стороне JavaScript вы бы сделали что-то вроде следующего, чтобы загрузить файл через XHR объект:

 <script>
        const pondElement = document.querySelector('input[type="file"]');
        const pond = FilePond.create( pondElement );

        FilePond.setOptions({
            server: {
                url: "{!! route('ajax.uploadFiles') !!}",
                process: {
                    headers: {
                        'X-CSRF-TOKEN': '{!! csrf_token() !!}'
                    }
                },
            }
        });
</script>
  

Теперь к сложной части: возврат / Удаление:

 <script>
        const filepond_root = document.querySelector('.filepond--root');
        filepond_root.addEventListener('FilePond:processfilerevert', e => {
            $.ajax({
                url: "{!! route('ajax.revertFiles') !!}",
                type: 'POST',
                data: {'_token': '{!! csrf_token() !!}', 'filename': e.detail.file.filename}
            })
        });
</script>
  

На вашем сервере (Laravel) это так же просто и прямолинейно, как следующее:

 public function uploadFiles(Request $request)
{
    if ($request->has('attachments')) {
        if (!file_exists(storage_path('app/tmp'))) {
            mkdir(storage_path('app/tmp', 0777, true));
        }

        $file = $request->file('attachments')[0];
        $file_name = $file->getClientOriginalName();

        $file_path = storage_path("app/tmp/{$file_name}");

        $file->storeAs(null, $file_name, 'tmp');
    }
}

public function revertFiles(Request $request)
{
    unlink(storage_path("app/tmp/{$request->filename}"));
}
  

PS: Этот код предназначен только для демонстрационных целей, пожалуйста, защитите свои формы и улучшите пользовательский интерфейс.

Скрипт Filepond в файле Laravel blade

 <!-- filepond script -->
<script>
    const inputElement = document.querySelector('input[id="file"]');
    const pond = FilePond.create( inputElement );
    FilePond.setOptions({
        server: {
            headers: {
                'X-CSRF-TOKEN': '{{ csrf_token() }}'
            },
            process: {
                url: '{{ route('store') }}',
            },
            revert: {
                url: '{{ route('destroy') }}',
            }
        }
    });
</script>
  

Метод уничтожения в файле контроллера Laravel

 public function destroy(Request $request)
{
    $folder = json_decode($request->getContent()); // folder name
}
  

я столкнулся с точно такой же проблемой. я сделал 2 вещи, чтобы это исправить.

1. должна иметь process.onload функцию и возвращать идентификатор объекта / путь. этот идентификатор / путь автоматически перейдет к функции revert.

2. в методе контроллера, который обрабатывает revert вызов. идентификатор / путь с шага 1 можно получить при вызове $request->getContent() , обратите внимание, что $request->all() не удается получить значение.