Uploading an Image | Creating a REST API with Node.js
Why Stack Overflow recommends it
Stack Overflow users link it when answering or following along with questions about uploading images with Multer in a Node/Express API, often alongside advice to keep files out of the database.
Recommended by 2 people across 1 different months, 2018 to 2022.
What it is
A 21-minute tutorial from Academind, part of its 'Creating a REST API with Node.js' series, showing how to handle image uploads in an Express API using the Multer middleware and store the file path alongside data in MongoDB. It includes source code and links to the Multer docs.
What people said
Recommends NeNaD · 2022-03 · Stack Overflow · on “What are some ways of storing images when using MongoDB Express React and Node.js?”
MongoDB is not a good place for storing files. If you want to store files, you should use storages like Amazon S3 or Google Could Storage. The good practice is to store the files in a storage and then to just save the URL of the uploaded image in the MongoDB. When it comes to Node.js and Express, I would suggest multer [LINK] package middleware, which is primarily used for uploading files. If you would use Amazon S3 for a storage, there is also a plug-in multer-s3 [LINK] package that can be helpful. You can check this video [this video] on how to configure Multer and implement image upload on your Node.js server. Once the image is uploaded, Multer will return data to you with destination field in
Recommends Dylan L. · 2022-03 · Stack Overflow · on “Store image at MongoDB using Gridfs or BSON”
MongoDB isn't made to store images, of course you can (very limited), but it's best to use another solution such as Amazon S3 or Google Cloud storage. You then take the url from those stored images and store that url as a field in your mongo document. You use it basically as a pointer to the image. If you do want to use mongoDB then you will need to use multer a good video on that is Uploading an Image | Creating a REST API with Node.js [this video] . Again. I want to reiterate the best approach is to use a 3rd party for storing large files such as images. MongoDB has size limits to their documents. Also if you're going to store this database remotely using Atlas then those images will take over
Cites Matiny · 2018-07 · Stack Overflow · on “Why does my image upload successfully in Postman form-data, but not in my react code?”
I was following Academind's tutorial on image uploads with node & multer here: [this video] And as predicted, his code worked just fine for me. However, as soon I switched from Postman to my React code, I began to get an error that the req.file.path of the image is undefined. How can I get the image to post correctly to my back end? Here is the faulty code: We start with the file input and the submit button. <label htmlFor="profilePic">Profile Picture</label> <input type="file" name="profilePic" className="inputfile" onChange={this.newFile}/> <section className="submit-form"> <span onClick={this.submitForm}> <p>SUBMIT</p> </span> </section> There are other inputs like textareas, but they work jus
Cites A.Hagman · 2018-09 · Stack Overflow · on “Node.js RESTful API validation error on array schema”
I am creating a RESTful API using Node.js and mongoose by following the tutorial by Acedemind [this video] . I have got it working just fine and am now expanding it to allow the client to post several products in the same order. Basically I am modifying a simple "POST" request to be an array instead of some variables. My problem is that I run into a long validation error that hinders the array from being created. Here is the code for the post request: router.post("/", async (req, res, next) => { const productsMaybeFalses = await Promise.all(req.body.products.map(async ({ productId })=> { const product = await Product.findById(productId); if (!product) { return false; } return { ...product, produc
Cites Nitin · 2019-08 · Stack Overflow · on “req.body and req.file always return empty in multer”
I'm following this Academind Tutorial [this video] for creating a node API endpoint for uploading images where I use body-parser for parsing json request and multer for parsing multipart/form-data request but every time I hit API using postman I get empty req.body and req.file too. This is multer implementation looks like const express = require('express'); const router = express.Router(); const bcrypt = require('bcrypt'); const mongoose = require('mongoose'); const jwt = require('jsonwebtoken'); const checkAuth = require('../middleware/check-auth'); const _ = require('lodash'); const assert = require('chai').assert; const multer = require('multer'); const storage = multer.diskStorage({ destinati
Cites Jerry Lee · 2020-01 · Stack Overflow · on “React/Express: POST error 413: Payload too large (Bodyparser does not work)”
I've tried everything but this just seems impossible to fix. I have browsed every [LINK] proposed [LINK] solution [LINK] on stackoverflow and burned through 3 google pages. Things I've tried Added extended: true/false within bodyParser.json Used bodyParser.urlencoder() Switched over and used multer extension following this tutorial [this video] but kept getting a path not found error. Someone please help React handlePrinting function: async function handlePrinting (file) { const raw = file.getFileEncodeBase64String() const destination = 'printer' const key = file.file.lastModified var data = { raw: raw, pageRanges: pageRanges, sides: sides, copies: copies, destination: destination, key: key } awa