Estoy tratando de hacer una solicitud de publicación, y es muy exitoso cuando lo hago con el cartero, pero estoy tratando de enviarlo desde el lado de mi cliente. Quiero publicar el carrito, pero como resultado constantemente estoy publicando artículos con una cantidad de 1 sin importar cuántas veces publique esa solicitud. ¿Cuál es la mejor solución para arreglar esto y publicar la solicitud de la manera normal?
Esta es mi solicitud de publicación:
app.post("/add-to-cart/:id", async (req, res) => { try { const id = req.params.id; const { data } = await axios.get("http://localhost:4200/products"); const singleProduct = await data.find((product) => product._id === id); let cart; if (!req.session.cart) { req.session.cart = cart = new Cart({}); } else { cart = new Cart(req.session.cart); } req.session.cart = cart; cart.addProduct(singleProduct); console.log(req.session.cart) res.send(cart); } catch (error) { console.log(error); } }); Este es el código del Cart :
module.exports = function Cart(oldCart) { this.productItems = oldCart.productItems || {}; this.totalQty = oldCart.totalQty || 0; this.totalPrice = oldCart.totalPrice || 0.00; this.addProduct = function(item) { let storedItem = this.productItems; if (!storedItem.hasOwnProperty("item")) { storedItem = this.productItems = {item: item, qty: 1, price: item.price}; this.totalQty = 1; this.totalPrice = item.price; } else { storedItem = {item: item, qty: storedItem.qty, price: storedItem.price}; console.log("STORED ITEM: ", storedItem); this.productItems = storedItem; storedItem.qty++; storedItem.price = storedItem.item.price * storedItem.qty; this.totalQty++; this.totalPrice += storedItem.item.price; } } } Esta es la función que puse en mi botón con @click.prevent="addToCart()"
addToCart(){ let productId = this.oneProduct.id; Cart.postCart(productId); }Estoy enviando esto desde el servicio axios en la interfaz:
postCart(productId){ return cartService.post(`/add-to-cart/${productId}`); }No hay advertencias ni errores cuando trato de interactuar con esto en el lado del cliente. Este es el resultado que obtengo en mi backend (repitiendo constantemente la información de un solo producto, sin embargo, esto funciona normalmente en el lado del cliente):
si está utilizando el marco de frontend, ya sea angular, vue, reaccionar o cualquier cosa que admita el enrutamiento. no necesita usar res.redirect para cambiar la ruta y obtener los datos.
¿Qué tal si usa res.send(cart) para devolver los datos del carrito y hacer el desvío en la interfaz?
async postCart(productId){ cartService.post(`/add-to-cart/${productId}`); // history.push('/your-next-route') }Creo que hay un problema en esta línea:
req.session.cart = cart = new Cart({});La razón por la que esta asignación no funciona como se esperaba se explica aquí:Asignación múltiple de mano izquierda con JavaScript
deberías cambiarlo a:
cart = new Cart({});El resto de la lógica debería funcionar.
como si su seesionId no se enviara al backend, ¿está usando fetch o axios?
buscar:
fetch('https://example.com', { credentials: 'include' })axios:
{withCredentials: true}¿Quizás el servidor y el cliente son de dominio cruzado? Establezca el valor apropiado de mismo sitio, vea esto: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Set-Cookie/SameSite