Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

239
Views
How to post image file to MongoDB using GridFS and fetch?

I am attempting to store images in MongoDB using GridFS

The images are uploaded on the client side so I'd like to use a fetch post-call that hits a route in my express server. That route is a post request to MongoDB using GridFS

Below is the fetch call:

function postDesignImages(order) {
  order.designs.map(async (design) => {
    var file = new File([design.image], design.image);
    console.log(file);

    await fetch('http://localhost:9000/design-images', {
      method: 'POST',
      mode: 'cors',
      body: file,
    })
      .then((res) => res.text())
      .then((data) => {
        console.log(data);
      })
      .catch(function (error) {
        console.log('Looks like there was a problem: \n', error);
      });
  });
}

Next are my end points... I'm calling the last one listed:

app.use('/', indexRouter);
app.use('/orders', orderRoutes);
app.use('/users', userRoutes);

app.use('/design-images', () => {
  router.post('/', (req, res) => {
    console.log(req.body);
    upload.single(req.body);
  });
});

There are several areas that I can see being the problem.

  1. As you can see I'm attempting to attach an actual file to the body of the fetch call. In the past, I've only used fetch bodies that were stringified JSON. The logged file object looks like this: File {name: 'blob:http://localhost:3000/8afdcdef-5426-460a-8cfa-eea24cc80856', lastModified: 1632324928209, lastModifiedDate: Wed Sep 22 2021 11:35:28 GMT-0400 (Eastern Daylight Time), webkitRelativePath: '', size: 63, …}
  2. The file itself might not be formatted correctly. I'm currently making a file out of a http blob. Despite the blob linking to an image, I could be converting the blob into a file that's not actually an image file.
  3. I could be creating the endpoint wrong in the express. As you may be able to tell, I have most of my routes in a routes folder except the 'design-images' route. Is it possible that I'm causing unintended errors by adding routes in 2 different manners? The frustrating part is there is no error message. Node just tells me: POST /design-images - - ms - - so I guess the route was hit but then nothing happens? I don't really know what to make of that output.

Any insight would be greatly appreciated. If you need any additional information feel free to ask.

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!