DEV Community

Karrel
Karrel

Posted on

Multer in javascript, node js Error in Uploading a Photo

Image description

Hello guys can you help me fix the error in my gallery page. I don’t know where is the error in my code. I already troubleshoot it but the are the same. I use vuejs a javascript framework the image above are the error when I click the post button.
Below are the code.

The upload photo file

const express = require('express');
const multer = require('multer');
const path = require('path');

const app = express();
const port = process.env.SERVER_PORT || 3000;

// Set up storage for uploaded files
const storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, '../assets/uploads');
},
filename: function (req, file, cb) {
const uniqueSuffix = Date.now() + '-' + Math.round(Math.random() * 1E9);
const fileExtension = path.extname(file.originalname);
cb(null, file.fieldname + '-' + uniqueSuffix + fileExtension);
}
});

const upload = multer({ storage: storage });

// Serve uploaded files statically
app.use('/uploads', express.static('uploads'));

// Handle file upload
app.post('/upload-photo', upload.single('image'), (req, res) => {
if (!req.file) {
return res.status(400).json({ message: 'No file uploaded' });
}

// You can perform additional logic here, like saving the file path to a database
// and returning a response.
const { DB_CURRENT_TIMESTAMP, queryDb } = require('@api/utils/mysql');

module.exports = async function(req, res) {
try {
const { image = '' } = req.body;

if (!image) {
return res.status(400).json({
message: 'Please select an Image.',
});
}

const imagePath = /uploads/${image.filename}; // Update the path to match your file storage location

// Save file path to the database
await queryDb(
INSERT INTO gallery (date_uploaded, image) VALUES (?, ?),
[DB_CURRENT_TIMESTAMP, imagePath]
);

return res.status(200).json({
message: 'Image Uploaded!'
});
} catch (err) {
res.status(500).json({
message: Server error : ${err.message}
});
}
};

res.status(200).json({ message: 'Image Uploaded' });
});

app.listen(port, () => {
console.log(Server is running on port ${port});
});

_To connect in database code file _

const { DB_CURRENT_TIMESTAMP, queryDb } = require('@api/utils/mysql');

module.exports = async function(req, res) {
try {
var {
// event_id = '',
// photo_name = '',
image = '',
} = req.body;
// var image = req.files && req.files.image;

  if (!image) {
      return res.status(400).json({
        message: 'Please select an Image.',
      });
  }
  // if (!event_id) {
  //     return res.status(400).json({
  //       message: 'Please provide the event Id.',
  //     });
  // }
  // if (!photo_name) {
  //     return res.status(400).json({
  //       message: 'Please provide a name for the photo.',
  //     });
  // }

  await queryDb(`
      INSERT INTO gallery (date_uploaded, image ) VALUES (?,?)`,
      [ DB_CURRENT_TIMESTAMP, image ]
  );

  return res.status(200).json ({
      message: 'Photo successfully added!'
  });
Enter fullscreen mode Exit fullscreen mode

}
catch(err) {
// console.log(err.message);
res.status(500).json({
message: Server error : ${err.message}
});
}
}

Top comments (0)