pqina / filepond

🌊 A flexible and fun JavaScript file upload library
https://pqina.nl/filepond
MIT License
15.21k stars 829 forks source link

[Bug] Patch requests are not sent to the 'process' endpoint #1023

Open gotexx1 opened 4 days ago

gotexx1 commented 4 days ago

Is there an existing issue for this?

Have you updated FilePond and its plugins?

Describe the bug

I'd like to set up a chunk file upload. However, Filepond sends PATCH requests to the current page and not to the ‘process’ endpoint.

The first POST request works correctly and I get an Transfer ID from my back-end. However, filepond then sends PATCH requests to the URL on the current page. Shouldn't it send the requests to /process? Thank you

Reproduction

This is my configuration:

    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/filepond/dist/filepond.min.css">
    <link rel="stylesheet"
          href="https://cdn.jsdelivr.net/npm/filepond-plugin-image-preview/dist/filepond-plugin-image-preview.min.css">
    <script
        src="https://cdn.jsdelivr.net/npm/filepond-plugin-image-preview/dist/filepond-plugin-image-preview.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/filepond/dist/filepond.min.js"></script>
    <script>
        const inputElement = document.querySelector('input[type="file"]');
        FilePond.registerPlugin(FilePondPluginImagePreview);
        const pond = FilePond.create(inputElement, {
            server: {
                process: {
                    url: '/api/medias/manage/process',
                    method: 'POST',
                    ondata: (formData) => {
                        formData.append('share_id', document.querySelector('input[name="share_id"]').value);
                        return formData;
                    }
                },
                revert: '/api/medias/manage/revert/',
                restore: '/api/medias/manage/restore/',
                load: '/api/medias/manage/load/',
                fetch: '/api/medias/manage/fetch/',
            },
            chunkUploads: true,
            chunkForce: true,
            imagePreviewHeight: 250,
            imagePreviewMarkupShow: false,
            credits: false
        });
    </script>
and my back-end:
    public function process(Request $request, $transferId = null)
    {
        if ($request->isMethod('post')) {
            $request->validate(['share_id' => 'required|exists:shares,id']);

            // Créer un ID unique pour le transfert
            $transferId = uniqid();
            $tempPath = storage_path("app/temp/{$transferId}");

            if (!file_exists($tempPath)) {
                mkdir($tempPath, 0777, true);
            }

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

        if ($request->isMethod('patch')) {
            $request->validate([
                'file' => ['required'],
            ]);

            $tempPath = storage_path("app/temp/{$transferId}");

            if (!file_exists($tempPath)) {
                return response('Transfer ID not found', 404);
            }

            $offset = $request->header('Upload-Offset');
            $fileName = $request->header('Upload-Name');
            $chunkPath = "{$tempPath}/chunk_{$offset}";

            file_put_contents($chunkPath, $request->getContent());

            $totalLength = $request->header('Upload-Length');
            $uploadedChunks = glob("{$tempPath}/*.chunk");
            $uploadedSize = array_sum(array_map('filesize', $uploadedChunks));

            if ($uploadedSize >= $totalLength) {
                $finalPath = storage_path("app/uploads/{$fileName}");
                $finalFile = fopen($finalPath, 'w');

                foreach ($uploadedChunks as $chunk) {
                    fwrite($finalFile, file_get_contents($chunk));
                    unlink($chunk);
                }

                fclose($finalFile);
                rmdir($tempPath);

                return response('File uploaded successfully', 200);
            }

            return response('', 204); // Chunk uploaded
        }

        return response('Method not allowed', 405);
    }

Environment

- Device: Computer
- OS: Fedora 41
- Browser: Firefox 132.0
rikschennink commented 3 days ago

You can add server.patch https://pqina.nl/filepond/docs/api/server/#url