如何在 FilePond JS 中恢复进程文件？

如何解决如何在 FilePond JS 中恢复进程文件？

我开始使用 Filepond JS，但我对如何调用某些函数感到困惑。也许是因为我对 ES6 的了解不是那么好，或者我只是想多了。该过程将文件上传到 tmp 文件夹。另一方面，revert 应该从 tmp 文件夹中删除上传的文件。

问题：我似乎无法在 filepond 中恢复上传。

我尝试过的事情：

1. 使用 uniqueFileId 传递 POST 请求
2. 使用 uniqueFileId 传递 DELETE 请求
3. 传递空的 DELETE 请求

感谢任何帮助。

我的 JS：

//File upload
FilePond.registerPlugin(
   FilePondPluginFileValidateSize,FilePondPluginFileValidateType,FilePondPluginFileEncode
);
    
const inputElement = document.querySelector("input[type='file']");

file = FilePond.create(
   inputElement,{
      credits: false,maxFileSize: "3000000",acceptedFileTypes: [
         'image/jpeg','image/png','application/pdf',],fileValidateTypeDetectType: (source,type) => new Promise((resolve,reject) => {
            resolve(type);
      }),server: {
         process:(fieldName,file,metadata,load,error,progress,abort,transfer,options) => {
                
            // fieldName is the name of the input field
            // file is the actual file object to send
            const formData = new FormData();
            formData.append(fieldName,file.name);

            const request = new XMLHttpRequest();
            request.open('POST',secureUrl("Model/filepond/index.php"));

            // Should call the progress method to update the progress to 100% before calling load
            // Setting computable to false switches the loading indicator to infinite mode
            request.upload.onprogress = (e) => {
               progress(e.lengthComputable,e.loaded,e.total);
            };

            // Should call the load method when done and pass the returned server file id
            // this server file id is then used later on when reverting or restoring a file
            // so your server knows which file to return without exposing that info to the client
            request.onload = function() {
               if (request.status >= 200 && request.status < 300) {
                  // the load method accepts either a string (id) or an object
                  load(request.responseText);
               }
               else {
                   // Can call the error method if something is wrong,should exit after
                   error('oh no');
               }
            };

            request.send(formData);

            // Should expose an abort method so the request can be cancelled
            return {
               abort: () => {
                  // This function is entered if the user has tapped the cancel button
                  request.abort();

                  // Let FilePond know the request has been cancelled
                  abort();
               }
            };
         },revert: (uniqueFileId,error) => {
            
            const formData = new FormData();
            formData.append(uniqueFileId);

            const request = new XMLHttpRequest();
            request.open('DELETE',secureUrl("Model/filepond-server-php-master/index.php"));

            request.send(formData);

            // Can call the error method if something is wrong,should exit after
            error('oh my goodness');

            // Should call the load method when done,no parameters required
            load();
          }
        }
      }
    );

我查看了 FilePond.class.php：

// revert existing transfer
if ($request_method === 'DELETE') {
   return call_user_func($routes['REVERT_FILE_TRANSFER'],file_get_contents('php://input'));
}

解决方法

我发现可以将服务器简化为以下内容，以便我们恢复上传。我不知道为什么另一种方式不起作用，但似乎工作得很好。

我的 JS 简化了：

//File upload
FilePond.registerPlugin(
   FilePondPluginFileValidateSize,FilePondPluginFileValidateType,FilePondPluginFileEncode
);
    
const inputElement = document.querySelector("input[type='file']");

file = FilePond.create(
   inputElement,{
      credits: false,maxFileSize: "3000000",acceptedFileTypes: [
         'image/jpeg','image/png','application/pdf',],fileValidateTypeDetectType: (source,type) => new Promise((resolve,reject) => {
            resolve(type);
      }),server: {
         url: secureUrl("Model/filepond/index.php"),process: './process',revert: './revert',restore: './restore/',load: './load/',fetch: null
       }
   }
);