I was building a twitter clone app where users can upload tweets with and without images. Before deploying my backend, everything worked fine. Users could upload tweets with and without images. However, after I deployed my backend, I've been unable to get users to upload a tweet with an image. I keep getting this error.
Error Enoent: no such file or directory
This happened after I deployed my backend to Render. It was working fine just before I deployed my backend It is currently impossible to upload an image at the moment. I think this has something to do with the way I'm setting the path in my multer middleware. Here's the middleware I use to upload images:
import multer from "multer";
const storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, "uploads");
},
filename: function (req, file, cb) {
cb(null, new Date().toISOString() + file.originalname);
},
});
const uploadFile = multer({ storage }).single("image");
export default uploadFile;
As you can see, I'm setting the storage path to "uploads". However, since I've deployed my backend somewhere else, I think it should be updated. Can anyone tell me how I should update it if I already have a backend hosted somewhere else. If I'm wrong and it has nothing to do with how I'm setting the path, can you tell me what's wrong and how to fix it? Thanks a lot!
Related
I am developing a platform where users should be able to create a hotel via an HTML form. Inside the form, there is an option to upload multiple image files.
I am using multer to handle the upload. My procedure is the following:
Create directory 'images'
Save uploaded images in 'images' directory
convert images in 'images' directory to base64
save base64-format in an array
save array in Hotel MongoDB Schema
delete directory 'images'
The upload and saving work perfectly but I get an error when I try to upload the next hotel:
Error: ENOENT: no such file or directory, open 'C:\ ...'
The images are successfully stored in the 'images' directory, but obviously, as the app crashes, nothing is done with the files so I have to delete them manually.
As this is only happening on the second try (when restarting the application, it works again) I assume that fs.readFileSync is executed before the images are done uploading. I am clueless as multer is part of my router chain, the conversion to base64 should happen AFTER all files are uploaded to the server.
What am I doing wrong?
Multer functions: https://i.stack.imgur.com/Wz167.png
Base64 conversion: https://i.stack.imgur.com/oOEmR.png
Delete function (executed after saving to DB) https://i.stack.imgur.com/PlTvH.png
Here is a simple snippet to get images as a base64.
Without storing them into the disk.
const express = require('express');
const multer = require('multer');
const storage = multer.memoryStorage();
const upload = multer({ storage });
const app = express();
app.post('/submit', upload.array('images'), (req, res, next) => {
// req.files is array of `images` files
// I believe it is a `Buffer` object.
const base64Images = req.files.map(image => buffer.toString('base64'));
// Ready to save into DB;
console.log(base64Images);
})
im trying to upload images on my app that's been served on heroku and it's says
ENOENT: no such file or directory
this is my code
router.post('/' ,multer({
storage : multer.diskStorage({
destination : (req , file , callback) => {
callback (null,'img')
} ,
filename : (req , file , callback) => {
callback(null , Date.now() + '-' + file.originalname)
}
})
})
and the architecture of my files
controllers
img this is the folder i want to upload to
public
routes
views
app.js
anyone can help >>>>?
https://help.heroku.com/K1PPS2WM/why-are-my-file-uploads-missing-deleted
Why are my file uploads missing/deleted?
The Heroku filesystem is ephemeral - that means that any changes to the filesystem whilst the dyno is running only last until that dyno is shut down or restarted. Each dyno boots with a clean copy of the filesystem from the most recent deploy. This is similar to how many container based systems, such as Docker, operate.
As a solution to this, I'd recommend you use an image serving service like imgur.com or cloudinary.com.
I'm learning Node.js with Express to get a little server running for studying. I'm getting response code 404 for all requests to files linked in my index.html file (e.g. the .css, .js, and image files).
The code I used to send index.html:
routes.get('/', (req, res) => {
res.sendFile(path.join(__dirname, "/clientSide/index.html"));
})
If I change the path to the whole folder instead:
routes.get('/', (req, res) => {
res.sendFile(path.join(__dirname, "/clientSide"));
})
I get in my browser the path from my hard drive to the folder, but I still can't view the files that way.
The clientSide folder contains index.html, app.js, style.css, and 2 or 3 images, all in the same folder. I can't view any of them.
I changed the filenames and folder name, and checked for capitalization to no avail.
SOLVED
I was using app.use(express.static(path.join(__dirname, "static/")));
With app = express();
That does not work, but using routes.use instead of app.use, while routes = express.Router();, is what solves that
The end
In your first code snippet, when you write:
routes.get('/', (req, res) => {
res.sendFile(path.join(__dirname, "/clientSide/index.html"));
})
You defined a new middleware function for requests to route /; that's what routes.get('/', ...) does. Assuming your server is running on port 3000, route / maps to http://127.0.0.1:3000/. For exactly that URL, and no other, Express executes your provided function, which replies with the the file clientSide/index.html. Thus, when your browser requests http://127.0.0.1:3000/, Express responds correctly.
But you've said nothing about the other files, such as http://127.0.0.1:3000/style.css, which would be route /style.css. You haven't defined any middleware for that route. So Express, not knowing what to do, by default responds with 404 and an error message. Thus, when your browser tries to load http://127.0.0.1:3000/style.css while fetching the resources referenced in index.html, the stylesheet fails to load.
Your second code snippet doesn't fix anything. It really makes things worse, because res.sendFile() can't send folders (how would that even work?) and that generates errors. You still haven't defined routes other than /, and now all your files are inaccessible.
To actually solve the problem, you could, theoretically, tediously define a route for every file, or more cleverly define one route with a route parameter. But serving a static folder with Express is a solved problem. You can simply offload the work to express.static by replacing all your code with:
routes.use(express.static(path.join(__dirname, "clientSide/")));
To go even further, you don't need Express or Node.js for a static file server. Try nginx. And for simple webpages, you don't need a server at all; just double-click index.html and let your browser open it.
I'm using the Mern stack, but I'm having an issue as to where to save uploaded files. Let me explain.
I have a form that sends over a formdata which includes a .jpg image.
On Node/express side, I receive it well. But now I'm stuck.
I'm using express-fileupload package which attaches an mv function that allows me to store my file in a directory.
In my endpoint, I have this snippet:
const img1= req.files.image1;
const img1Name = img1.name;
img1.mv("NOT-SURE-WHERE-TO-MAKE-MY-DIRECTORY"+img1Name, (err) => {
if (err) {
return res.status(500).json({message: 'Could Not mv file'});
} else {
return res.status(200).json({message: 'mv done'});
}
})
Where do I create the directory to store the .jpg image?
Do I create it in the client's src? or client's public?
Or, do I run the npm-run-build command to create my build folder and then point my mv function to save the file in there?
create a static file middleware in node app.js file to public directory then # public/images
If not try using multer it is much easier to upload Files
express 4.13
node.js 5.7.0
I am trying to make resposne to user with renamed file.
Archive.findById(req.params.id, function(err, file) {
res.download(file.path, "justfile.docx");
});
This code doesn't working. When i use it, file downloaded with default name, not with "justfile.docx".