TypeError: Eigenschaften von undefiniert (Lesen von „Titel“) können nicht gelesen werden, wenn Dummy-ImageUrl in der Nod ⇐ JavaScript

[Anonymous]

Ich erstelle ein Node.js-Projekt (aus einem Udemy-Kurs) und erhalte diese Fehlermeldung, wenn ich auf die Schaltfläche „Details“ klicke:
Nachdem ich eine Weile debuggt und ähnliche Frage-und-Antwort-Diskussionen überprüft habe, habe ich festgestellt, dass das Problem nur auftritt, wenn ich beim Hinzufügen eines Produkts einen Dummy-Text (wie abc) im Feld imageUrl verwende.

Wenn ich Folgendes bereitstelle eine gültige Bild-URL (wie ein tatsächlicher Bildlink), alles funktioniert einwandfrei.
In einer der Fragen und Antworten erwähnte jemand, dass es möglicherweise an einer zweiten Anfrage oder etwas im Zusammenhang mit dem Abrufen der Produktdaten lag, aber ich konnte den Grund nicht vollständig verstehen.
Meine Fragen:

• Warum tritt dieser Fehler auf?
• Warum funktioniert es mit einer echten Bild-URL, löst aber einen Fehler mit Dummy-Text aus?

Hinweis: Ich verwende eine JSON-Datei (

Code: Select all

data/product.json

), um die Produktdaten zu speichern. Die Datei wird korrekt aktualisiert, wenn ich Produkte hinzufüge, und ich kann sehen, dass der Dummy-Image-Url-Text dort gespeichert wird.


Fehlermeldung

Code: Select all

TypeError: Cannot read properties of undefined (reading 'title')
at C:\Users\haris\Desktop\NODEJS\backend-1\controllers\shop.js:19:25
at C:\Users\haris\Desktop\NODEJS\backend-1\models\product.js:48:7
at C:\Users\haris\Desktop\NODEJS\backend-1\models\product.js:15:7
at FSReqCallback.readFileAfterClose [as oncomplete] (node:internal/fs/read/context:68:3)

Node.js v24.4.0

shop.js (Controller)

Code: Select all

const Products = require("../models/product.js");

exports.getProducts = (req, res, next) => {
Products.fetchAll((allProduct) => {
res.render("shop/product-list", {
p: allProduct,
docTitle: "All Products",
path: "/products",
});
});
};

exports.getProduct = (req, res, next) => {
const prodId = req.params.productId;
Products.findById(prodId, (product) => {
console.log(product);
res.render("shop/product-detail", {
product: product,
docTitle: product.title,
path: "/products",
});
});
};

exports.getIndex = (req, res, next) => {
Products.fetchAll((allProduct) => {
res.render("shop/index", {
p: allProduct,
docTitle: "Shop",
path: "/",
});
});
};

exports.getCart = (req, res, next) => {
res.render("shop/cart", {
path: "/cart",
docTitle: "Your Cart",
});
};

exports.getOrders = (req, res, next) => {
res.render("shop/orders", {
path: "/orders",
docTitle: "Your Orders",
});
};

exports.getCheckOut = (req, res, next) => {
res.render("shop/checkOut", {
path: "/checkout",
docTitle: "Checkout",
});
};

product.js (Modell)

Code: Select all

const fs = require("fs");
const path = require("path");
const homePath = require("../utils/path.js");

const p = path.join(homePath, "data", "product.json");

const getProductFromFile = (cb) => {
fs.readFile(p, (err, fileCont) => {
if (err) {
cb([]);
} else {
cb(JSON.parse(fileCont));
}
});
};

module.exports = class Products {
constructor(title, imageUrl, price, description) {
this.title = title;
this.description = description;
this.imageUrl = imageUrl;
this.price = price;
this.id = Math.random().toString();
}

save() {
getProductFromFile((products) => {
products.push(this);
fs.writeFile(p, JSON.stringify(products), (err) => {
console.log(err);
});
});
}

static fetchAll(callback) {
getProductFromFile(callback);
}

static findById(id, cb) {
getProductFromFile((products) => {
const product = products.find((p) => p.id == id);
console.log(id);
cb(product);
});
}
};

product-details.ejs

Code: Select all

[img]