nielsboogaard / filepond-plugin-get-file Goto Github PK

When I import and try to use the plugin, I get the following error when compiling

export 'default' (imported as 'FilePondPluginGetFile') was not found in 'filepond-plugin-get-file' (module has no exports)

My setup looks like the following:

import * as FilePond from 'filepond';
import * as Pintura from '@pqina/pintura';
import FilePondPluginFileValidateType from 'filepond-plugin-file-validate-type';
import FilePondPluginImageValidateSize from 'filepond-plugin-image-validate-size';
import FilePondPluginImageEditor from '@pqina/filepond-plugin-image-editor';
import FilePondPluginFilePoster from 'filepond-plugin-file-poster';
import FilePondPluginGetFile from 'filepond-plugin-get-file';

FilePond.registerPlugin(
    FilePondPluginGetFile,
    FilePondPluginFileValidateType,
    FilePondPluginImageValidateSize,
    FilePondPluginImageEditor,
    FilePondPluginFilePoster
);

Do you have any recommendations on what to try?

Some images loaded from the server show 'undefined' as file name.
It can change after refresh which files show undefined.

Code:

With plugin:

Without plugin:

When using allowDownloadByUrl it changes current href instead of downloading a file. It should use same code as the Else content but instead of createObjectURL, use the metadata.

const downloadFile = (item, allowDownloadByUrl) => {
const a = document.createElement('a');
const url = allowDownloadByUrl && item.getMetadata('url') ? item.getMetadata('url') : window.URL.createObjectURL(item.file);
document.body.appendChild(a);
a.style.display = 'none';
a.href = url;
a.download = item.file.name;
a.click();
window.URL.revokeObjectURL(url);
a.remove();
};

serialize-javascript vulnerability is fixed in 2.1.1

rollup-plugin-terser PR fixes this: TrySound/rollup-plugin-terser#54 or TrySound/rollup-plugin-terser#53

Waiting for merge before updating rollup-plugin-terser

I'm trying to use te plugin inside an Angular app but I'm not having any success at the moment of displaying the drop zone area. Is there any special attribute I should add in my pondOptions object to enable the functionality and be able to visualize the download option?

This is my object so far:

pondOptions = { class: 'my-filepond', labelIdle: 'Arrastre su archivo o haga click <span class="filepond--label-action" tabindex="0">aquí</span> para seleccionarlo', required: this.required, multiple: this.multipleFiles, maxFiles: this.maxFiles, allowFileTypeValidation: this.fileTypeValidation, acceptedFileTypes: this.mediaTypes.toString(), labelFileTypeNotAllowed: 'Tipo de archivo inválido', fileValidateTypeLabelExpectedTypes: 'Formatos soportados: ' + this.acceptedFileTypes.toString(), allowFileSizeValidation: this.fileSizeValidation, maxFileSize: this.maxFileSize, labelMaxFileSizeExceeded: 'El archivo es muy grande', labelMaxFileSize: 'El tamaño máximo de archivo es ' + this.maxFileSize, name: 'filepond', allowDownloadByUrl: true };

And this is the HTML associated with it:

<file-pond #myPond [options]="pondOptions" [files]="pondFiles" (oninit)="pondHandleInit()"
    (onaddfile)="pondHandleAddFile($event)">
</file-pond>

Thanks!

I'm getting this error:
filepond-plugin-get-file.js:45 Uncaught TypeError: Failed to execute 'createObjectURL' on 'URL': No function was found that matched the signature provided.
In this link I found that It is because of deprecation of createObjectURL in Google Chrome newer versions.
I think this library should be updated and solve this issue.

Setting allowDownloadByUrl = true yields no change in behaviour. When debugging, the value is null, so it is not using getting the value.

It would also be helpful to improve the documentation, with examples as the demo does not show all options. I had to look through the code to figure out that it's looking at the file metadata for the url. When allowDownloadByUrl is set to false chrome just spits out Uncaught TypeError: Failed to execute 'createObjectURL' on 'URL': No function was found that matched the signature provided.

https://stackoverflow.com/questions/27120757/failed-to-execute-createobjecturl-on-url

Not sure how it would even work if that function did work. The file on server is quite often stored in a permanent location that is not publicly accessible via URL. There is no way the utility would know what path to reach it at automatically.

Hi,
When I enable the plugin, I can only see the download icon. The filename disappears:

Plugin enabled:

Plugin disabled:

Here is my filepond configuration (note I am loading the file using the "load" endpoint):

FilePond.setOptions({
  server: './file',
  allowMultiple: true,
  allowReplace: false,
});

const filepondfiles = [];

files.forEach((id) => {
  filepondfiles.push({
    // the server file reference
    source: id,

    // set type to local to indicate an already uploaded file
    options: {
      type: 'local',
    },
  });
});

FilePond.setOptions({
  files: filepondfiles,
});

I followed the instructions in the readme. I am using filepond 4.12.0, same as your demo page, so it's probably safe to rule out a problem with versions. Any idea what might be wrong? Thanks!

Hi, is there any tutorial/documentation on how to implement this plugin into react package?
I followed the installation guide in your readme but could not make it work.
What I did:
npm install filepond-plugin-get-file
import {FilePond, registerPlugin} from "react-filepond";
import FilePondPluginGetFile from 'filepond-plugin-get-file';

registerPlugin( FilePondPluginGetFile);

Is there any working solution or can you tell me what I did wrong? Thanks.

Clicking "remove item" button doesn't fire activatefile event but download button does so I feel like this is not an intended behaviour.

Are you using other components when you preview the picture?