I am creating a cocktail website & database using node.js, MySql, Express, and Pug.
I've recently tried using a route parameter so that different cocktails have different URLs instead of passing the name via get. So the URL should be "localhost:3000/cocktail/Cosmopolitan" instead of "localhost:3000/cocktail?name=Cosmopolitan". Problem is that my get route seems to be called twice. Once with the correct parameter "Cosmopolitan" and then again which the parameter "style.css" which results in the site displaying without any styling and the TypeError in the output further down.
My cocktail Route currently looks like this:
const Router = require('express-promise-router');
const db_func = require("../database/db_functions");
const router = new Router();
router.get("/:name", async (req, res) => {
var name = req.params.name;
console.log(req.params);
const cocktail = await db_func.getCocktail(name);
const ingredients = await db_func.getIngredientById(cocktail["id"]);
console.log(ingredients);
await res.render('cocktail', {
cocktail: cocktail,
ingredients: ingredients
});
});
module.exports = router;
The problem now is that this outputs
{ name: 'Cosmopolitan' }
[
RowDataPacket { name: 'Wodka', amount: 5, measure: 'cl', garnish: 0 },
RowDataPacket {
name: 'Limettensaft',
amount: 2,
measure: 'cl',
garnish: 0
},
RowDataPacket {
name: 'Cointreau',
amount: 2,
measure: 'cl',
garnish: 0
},
RowDataPacket {
name: 'Cranberrynektar',
amount: 2,
measure: 'cl',
garnish: 0
}
]
{ name: 'style.css' }
TypeError: Cannot read property 'id' of undefined
at F:\Arbeit und Studium\Projects\Cocktail Database\Cocktail Node\routes\cocktail.js:10:65
at processTicksAndRejections (internal/process/task_queues.js:97:5)
The corresponding pug files. cocktail.pug:
extends layouts/layout
block content
h4.random-title #{cocktail.name}
p Served in a #{cocktail.glass} Glass!
div.ingredient-list
- for (var i = 0; i < ingredients.length; i++)
p - #{ingredients[i].amount} #{ingredients[i].measure} #{ingredients[i].name}
p Recipe by: #{cocktail.author}
And layouts/layout.pug
doctype html
html
head
title Cocktailbar
link(rel="stylesheet" type="text/css" href="style.css")
body
div.page-container
...
I'd appreciate any input!