Estoy intentando guardar los datos de un producto con la url de la img en la base de datos con Angular
y Nodejs
.
Nodejs
muestra el siguiente este error: [1] (node:7256) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'path' of undefined
Aca en Nodejs
,mi books.controller.ts
export const createBook = async (req: Request, res: Response): Promise<Response> => {
// recibo los datos (de un form, insomnia rest, etc..)
const { name, year, id_author, id_category, id_editorial, description, quantity, price, url_image, state} = (req.body);
console.log(name, year, id_author, id_category, id_editorial, description, quantity, price, url_image, state)
// el id_book en la db es autonumerico no hace falta
let book_year = parseInt(year);
let id_aut = parseInt(id_author);
let id_cat = parseInt(id_category);
let id_edi = parseInt(id_editorial);
let cantidad = parseInt(quantity);
let precio = parseInt(price);
let url_img = (req as any).file.path; //?
console.log('url imagen en server: ' + url_img)
// let idBook = parseInt(id_book);
// insert en PostgreSQL
// const response: QueryResult = await pool.query('INSERT INTO books (name, year, id_author, id_category, id_editorial, description, quantity, price, url_image, state) VALUES ($1, $2, $3, $4, $5, $6, $7, $8, $9, $10)', [name, book_year, id_aut, id_cat, id_edi, description, cantidad, precio, url_image, state]);
const response: QueryResult = await pool.query('INSERT INTO books (name, year, id_author, id_category, id_editorial, description, quantity, price, url_image, state) VALUES ($1, $2, $3, $4, $5, $6, $7, $8, $9, $10)', [name, book_year, id_aut, id_cat, id_edi, description, cantidad, precio, url_img, state]); // ?
return res.json({
message: 'El libro ah sido creado exitosamente!',
body: {
books: {
name
}
}
})
}
Aca en Nodejs
mi books.routes.ts
import { Router } from 'express'
const router = Router();
import express from 'express'
var multer = require('multer')
const uuid = require('uuid')
const app = express();
const cors = require('cors');
const path = require('path');
import { createBook } from '../controllers/books.controller'
// ******************* PARA HACER UPLOAD DE IMAGE ******************* //
const storage = multer.diskStorage({
destination: (req, file, callBack) => {
//carpeta donde va a guardar las imgs
callBack(null, 'uploads')
},
filename: (req, file, callBack) => {
// uuid.v4() guarda la img con id aleatorio, para que no
// se pisen imagenes en el caso que se suban con el mismo nombre
callBack(null, uuid.v4() + path.extname(file.originalname).toLocaleLowerCase());
}
})
const upload = multer({
storage,
dest: 'uploads/',
//dest: path.join(__dirname, 'public/uploads'),
limits: {fileSize: 2000000}, //max permitido de image, 2 mega byte de peso
fileFilter: (req, file, cb) => {
const fileTypes = /jpeg|jpg|png|gif/; // expresion regular
// mimetype checkea si el archivo es valido ej img/extension del archivo
const mimetype = fileTypes.test(file.mimetype);
// con path.extname checkea si la img tiene la extension .jpeg o .jpg o .gif o .png
const extname = fileTypes.test(path.extname(file.originalname));
if(mimetype && extname){
return cb(null, true);
}
else{
cb("Error: el archivo debe ser una imagen valida");
}
}
}).single('file');
app.post('/file', upload, (req, res, next) => {
const file = (req as any).file;
console.log(file);
if(!file){
console.log('No se subió ninguna imagen');
}
res.send(file);
// para mostrar la ruta por console log se puede sacar
var ruta = (req as any).file.path
console.log('ruta de imagen: ' + ruta);
})
// ******************* FIN UPLOAD DE IMAGE ******************* //
router.post('/books', upload, createBook);
export default router;
Aca la funcion en Angular
, donde le envio los datos del formulario al servidor Nodejs/express
createBook(event: Event) {
event.preventDefault();
if (this.form.valid)
{
if (confirm('¿Esta seguro/a que desea agregar el producto?'))
{
// obtengo todos los valores del formulario
this.book = this.form.value;
this.book.id_author = parseInt(this.selectedIdAut);
this.book.id_editorial = parseInt(this.selectedIdEdi);
this.book.id_category = parseInt(this.selectedIdCat);
// this.book.url_image = '/uploads/' + this.imageSelected;
this.book.url_image = '';
// SUBO IMAGEN ////
if (this.imageSelected != null){
const formData = new FormData();
formData.append('file', this.imageSelected);
// subo la imagen a nodejs
this.http.post<any>('http://localhost:4000/file', formData).subscribe(
(res) => console.log(res),
(err) => console.log('El servidor no guardó la img, no reconoce el formato: ' + err)
);
this.cleanImgPreview(); // hago desaparecer la img preview
}
// guardo los datos
this.bookService.createBook(this.book)
.subscribe((res) => {
console.log(res);
});
// vuelvo a a traer los libros
this.bookList$ = this.bookService.getBooksWithAuthorName();
this.resetForm();
this.book = {} as Book; // vuelvo a declarar objeto para ponerlo en vacio
// this.toastr.success('Operación exitosa', 'Producto agregado!');
}
}
}