estoy aprendiendo nodejs e intento cargar un archivo de imagen sin recargar la página, estoy usando este código a continuación pero no funciona. Req.body está vacío. Alguien puede ayudarme ?
en mi archivo ejs:
````````````````` <body> <form action="/" method='post' enctype="multipart/form-data" id='form-data'> <input type="file" name='file' id='file' class='file'> </form> <script> $(document).on('change', '#file', function () { var property = document.getElementById('file').files[0]; var form_data = new FormData(); form_data.append('file', property); $.post({ url: '/', type: 'post', data: form_data, contentType: false, cache: false, processData: false, success: function (data) { console.log(data); } }) }) </script> </body> `````````````````Este es servidor.js:
const express = require('express'); const app = express(); const path = require('path'); app.set('view engine', 'ejs'); app.set('views' , __dirname); app.use(express.static(path.join(__dirname, 'public'))); app.use(express.urlencoded({ extended: true })); app.post('/', (req,res) =>{ console.log(req.body) }) app.get("/", (req,res) =>{ res.render('main'); }) app.listen(3000);La forma más fácil que conozco para lograr lo que pretendes hacer es con multer .
Express no maneja fácilmente los archivos por sí solo, por lo que al incorporar multer como un middleware, puede cargar archivos fácilmente. eche un vistazo a la línea 5 y vea "dest", cámbielo a donde quiera que se carguen los archivos
En la línea 12, agregué el middleware a la ruta de publicación, la razón por la que pasé en 'archivo' es que la clave de datos del formulario para el archivo es 'archivo'
En la línea 13, he cambiado console.log de req.body a req.file, ya que puede acceder a la información del archivo desde allí con multer
const express = require('express'); const app = express(); const path = require('path'); const multer = require('multer') const upload = multer({ dest: './uploads/' }) app.set('view engine', 'ejs'); app.set('views' , __dirname); app.use(express.static(path.join(__dirname, 'public'))); app.use(express.urlencoded({ extended: true })); app.post('/', upload.single('file'), (req,res) =>{ console.log(req.files) }) app.get("/", (req,res) =>{ res.render('main'); }) app.listen(3000);Para instalar multer, consulte el enlace que he agregado o simplemente escriba:
npm install multerSaludos, Daniel