CODEWITHSUNDEEP
node.jsexpresspug
user2663041
user2663041

Reputation: 229

Express | Routing is messing up css

I ran into a problem I couldn't find an answer for. I'm using Express for my website's framerwork and I'm using its routing but it seems to mess up links and files attached to a page.

Here is what I use : 

app.get('/profile/:name/:age', function(req, res) {
  var name = req.params.name;
  var age = req.params.age;
  someFunction(name, age, function(error, profile) {
    res.render('userprofile', profile);
  });
});

The page renders but the links are broken, instead of going to example.com/css/main.css it goes to example.com/profile/(whatever name I went to)/css/main.css so this returns html instead of the css file. Same things for my links.

Note that I can show up that, with css enabled, no problem : 

app.get('/profile', function(req, res) {
  res.render('userprofile');
});

Upvotes: 0

Views: 238

Answers (1)

robertklep
robertklep

Reputation: 203494

Sounds like you're using relative url's for your CSS:

<link rel="stylesheet" href="css/main.css">

If the current (page) url is /profile/username/, that translates to:

/profile/username/css/main.css

Solution? Use absolute url's for resources and links:

<link rel="stylesheet" href="/css/main.css">

Upvotes: 3

Related Questions