1

In my express project, when I render the product route with an id, the assets try and load from /products presumably in the public folder (products doesn't exist), but when I render the same html from a slightly different template on /franchino route, it pulls the assets correctly from the public folder.

What's going on and how can I fix this?

Route that doesn't work. 

router.get('/product/:slug', function(req, res) {
    //route params
      var slug = req.params.slug;
      var productResp; //scope up api response to pass to render()
      console.log(slug);
    //api call
      Prismic.api("https://prismic.io/api").then(function(api) {
        return api.getByUID('product' , slug);
      }).then(function(response) {

        res.render('product-template', {
          product: response,
        })

      }, function(err) {
        console.log("Something went wrong: ", err);
      });
    });

Error:

GET /product/include/rs-plugin/js/extensions/revolution.extension.migration.min.js 404 0.843 ms - 1226
GET /product/include/rs-plugin/js/extensions/revolution.extension.parallax.min.js 404 1.069 ms - 1226

Route that does work: 

router.get('/franchino', function(req, res) {
  res.render('index-rest');
});

App.js

app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.use(express.static(path.join(__dirname, 'public')));

File Structure: 

project 
   app.js
   routes
      index.js
   views
      snippets
         snippets
      all templates
   public
      css
      includes 
      js
      etc...
Quesofat
  • 1,493
  • 2
  • 21
  • 49
  • change the route here `router.get('/api/product/:slug', function(req, res) {` – El houcine bougarfaoui Mar 09 '17 at 22:26
  • What does the `console.log(slug);` give you? Is `console.log("Something went wrong: ", err);` called? what happens if you do `console.log(response);`? – David Knipe Mar 09 '17 at 22:43
  • I'm not sure why any of this happened but putting `../` in front of all of the imports worked. It thought /products was a folder in public. – Quesofat Mar 10 '17 at 00:16
  • If someone can explain why, I will accept the answer. – Quesofat Mar 10 '17 at 00:16
  • I think the `:slug` part is only allowed to match a single component of the path. So it will work with `http://www.example.com/product/my-slug` but not `http://www.example.com/product/include/my-slug`. But I can't explain why the `express.static` failed. Your filesystem diagram says `app.js` is in the `project` directory, so `__dirname` should be the `project` directory and `path.join(__dirname, 'public')` should be `project/public`. If you'd used `__filename` instead of `__dirname` it would make sense. But it's a mystery. – David Knipe Mar 10 '17 at 22:28

1 Answers1

1

It looks like whenever there is a multi-tiered route i.e. /products/toys

the line for default asset pulling: app.use(express.static(path.join(__dirname, 'public'))); needs to be changed to app.use('/toys', express.static(__dirname + '/public')); to reflect the route.

Per: Express-js can't GET my static files, why?

Community
  • 1
  • 1
Quesofat
  • 1,493
  • 2
  • 21
  • 49
  • Thanks! this solves it (at least for me). But there must be some other solution. If I have 5 endpoints (`/product/:option`,`/service/:option`,`/worker/:option`,`/queue/:option`,`/dabase/:option`) and 5 asset folders (`/crm`,`/images`,`/files`,`/js`,`/css`)... then I have to map it 30 times!!! `app.use(express.static(__dirname + '/crm'));` `app.use(express.static(__dirname + '/images'));` ... `app.use('/product', express.static(__dirname + '/crm'));` `app.use('/product', express.static(__dirname + '/images'));` ... `app.use('/service', express.static(__dirname + '/crm'));` ... – dinigo Sep 13 '18 at 16:35