Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Unexpected error when using getFileEncodeDataURL #22

Open
socketopp opened this issue Apr 14, 2022 · 3 comments
Open

Unexpected error when using getFileEncodeDataURL #22

socketopp opened this issue Apr 14, 2022 · 3 comments

Comments

@socketopp
Copy link

socketopp commented Apr 14, 2022 •
edited
Loading

I thought I would notify the maintainers of this error.
Discovered in "filepond-plugin-file-encode": "^2.1.10".

Code essentially:

 onupdatefiles={(fileItems) => {
 const file =  fileItems[0].getFileEncodeDataURL();
 }

Here is the error log.

Unhandled Rejection (TypeError): base64Cache[item.id] is undefined

./node_modules/filepond-plugin-file-encode/dist/filepond-plugin-file-encode.js/</plugin/</<
~/node_modules/filepond-plugin-file-encode/dist/filepond-plugin-file-encode.js:72
handleFile
~/src/pages/Create/Create.js:48

  45 | console.log(fileItems);
  46 | // const res = await fileItems[0].getFileEncodeBase64String();
  47 | // try {
> 48 |   const re2 = fileItems[0].getFileEncodeDataURL();
     | ^  49 |   console.log(re2);
  50 | // } catch (error) {
  51 | //   console.log('reject', error);

onupdatefiles
~/src/components/FileUpload/FileUpload.js:32

  29 | imagePreviewMaxHeight={400}
  30 | imagePreviewMinHeight={200}
  31 | onupdatefiles={(fileItems) => {
> 32 |   if (fileItems.length) handleFile(fileItems);
     | ^  33 | }}
  34 | // imagePreviewMaxHeight={256}
  35 | // files={files}

./node_modules/react-filepond/dist/react-filepond.js/componentDidMount/options.onupdatefiles
~/node_modules/react-filepond/dist/react-filepond.js:80
exposeEvent
~/node_modules/filepond/dist/filepond.js:11724
./node_modules/filepond/dist/filepond.js/</createApp/routeActionsToEvents/</</<
~/node_modules/filepond/dist/filepond.js:11742
setTimeout handler*./node_modules/filepond/dist/filepond.js/</createApp/routeActionsToEvents/</<
~/node_modules/filepond/dist/filepond.js:11741
./node_modules/filepond/dist/filepond.js/</createApp/routeActionsToEvents/<
~/node_modules/filepond/dist/filepond.js:11736
routeActionsToEvents
~/node_modules/filepond/dist/filepond.js:11733
_write
~/node_modules/filepond/dist/filepond.js:11570
./node_modules/filepond/dist/filepond.js/</</<
~/node_modules/filepond/dist/filepond.js:12569
./node_modules/filepond/dist/filepond.js/</<
~/node_modules/filepond/dist/filepond.js:12568
./node_modules/filepond/dist/filepond.js/</createPainter/tick/<
~/node_modules/filepond/dist/filepond.js:1408
tick
~/node_modules/filepond/dist/filepond.js:1407
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386
FrameRequestCallback*requestTick
~/node_modules/filepond/dist/filepond.js:1370
tick
~/node_modules/filepond/dist/filepond.js:1386

I get around this by wrapping try catch around getFileEncodeDataURL.
@socketopp socketopp changed the title Unhandled Rejection (TypeError): base64Cache[item.id] is undefined Unexpected error when using getFileEncodeDataURL Apr 14, 2022
@KentShikama
Copy link

I'm getting the same error too through the React wrapper.

Uncaught TypeError: base64Cache[item.id] is undefined
    plugin filepond-plugin-file-encode.js:74
    onupdatefiles ImageUploadQuestion.js:65
    onupdatefiles ImageUploadQuestion.js:65
    onupdatefiles react-filepond.js:84
    exposeEvent filepond.js:11734
    routeActionsToEvents filepond.js:11752
    setTimeout handler*./node_modules/filepond/dist/filepond.js/</createApp/routeActionsToEvents/</< filepond.js:11751
    routeActionsToEvents filepond.js:11746
    routeActionsToEvents filepond.js:11744
    _write filepond.js:11580
    js filepond.js:12579
    js filepond.js:12578
    tick filepond.js:1408
    tick filepond.js:1407
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
    requestTick filepond.js:1370
    tick filepond.js:1386
[filepond-plugin-file-encode.js:74](webpack:///node_modules/filepond-plugin-file-encode/dist/filepond-plugin-file-encode.js)

@semics-tech
Copy link

This is also happening with the vue wrapper, gettting TypeError: Cannot read properties of undefined (reading 'data') because base64Cache[item.id] is undefined.

Is there a fix for this or a workaround? I'm unable to use this plugin

@rikschennink
Copy link
Collaborator

Should be fixed in 2.1.12

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@rikschennink @KentShikama @socketopp @semics-tech