File Picker - Not workin work with Express File Upload

Hi There – I’m trying to setup the file picker component to use the express file-upload package when saving a form. However, when i go to save any form that uses the file picker, I get 'Request is not eligible for file upload` when the express file-upload package goes to parse the request and make the file available. I’ve updated the file size limits so those aren’t the issue (reported in other topics). I’ve also tried attaching the photo attribute directly to the body (as opposed to req.body.attributes.photo).

Expected behavior

File picker should integrate seamlessly with express file-upload package as it is the #1 node package for handling files server-side.

Actual behavior

Request is not eligible for file upload` when the express file-upload package goes to parse the request and make the file available.

Context

Please provide any relevant information about your setup.

  • Package Version:
  • Express Version: 4.16.3
  • Sequelize Version: 5.15.1
  • Database Dialect: postgres
  • Database Version: 6.1
  • Project Name: Blush

Hi @ehubbell

Welcome back to the Forest Admin community!

The issue context is not yet clear to me.
Is it an Admin backend generated with the Lumber CLI?
If so why did you need to add a dedicated package to manage file upload?

Thanks for your help.

Hey Arnaud – Thanks for the reply. I figured out the issue. I typically use filestack-js for photo / file uploads on the front-end so I always get a simple URL that I then save to the database. Thus, I’m not as well-versed uploading files to the server. The express-fileupload package is supposed to make it incredibly easy to handle but their documentation is limited and their use-case is somewhat specific (zero mention of base64 encoded strings and how to handle them).

After some research, I figured out that your file picker component sends a base64 encoded string to the server which then needs to be decoded before writing it directly to the file system via the fs.writeFileSync() method. From there, I upload the image to Filestack server-side so I get the same URL I get from the front-end which they host, secure and put on a CDN for us.

I will say, FA’s documentation around all this was pretty non-existent. It would help if you specify in the docs that the file picker uploads a base64 encoded string that you can then write to the filesystem server-side. That should help any future developer get on the right track.

Thanks!
Eric

2 Likes

Hey @ehubbell. Happy to know that you solved your issue!

I will say, FA’s documentation around all this was pretty non-existent. It would help if you specify in the docs that the file picker uploads a base64 encoded string that you can then write to the filesystem server-side. That should help any future developer get on the right track.

We’re always looking for this kind of feedback. I’m forwarding this to the team so the documentation can be updated that way.

Thanks :pray: