Geek Answers Handbook

Node / Express - Serve-static does not work / How to use routes using static files

I am having problems routing and maintaining static files.

My directory structure is this:

app/ --server.js --controllers/ --directives/ --etc. assets/ --img/ --css/ --etc. views/ --partials/ --view1.jade --view2.jade --index.jade --layout.jade --etc.

I would like this to happen:

  • application / - serve static files (for example, "GET / app / controllers / controller.js" should send literals)
  • assets / - serve static files (for example, "GET / assets / css / custom.css" should send literals)
  • views / - Dynamic routing (for example, "GET / partials / view1" uses the routing rules that I set)

This is how I set up my server:

  ... //PATHS: var viewsPath = path.join(__dirname, '..', 'views'); var appPath = path.join(__dirname, '..', 'app'); var assetsPath = path.join(__dirname, '..', 'assets'); ... //SERVE-STATIC: app.set('views', viewsPath); app.use(serveStatic(appPath)); app.use(serveStatic(assetsPath)); ... //ROUTES: // serve index and view partials app.get('/', routes.index); //Partials app.get('/partials/:name', routes.partials); ...

But this is what happens when I visit the index:

 [.../app]$ node app.server.js **Node Version: v0.12.2 **Express Version: 4.12.3 Path to views: /myproject/views Static serving: /myproject/app Static serving: /myproject/assets Express server listening on port 3000 GET / 304 765.837 ms - - GET /assets/css/app.css 404 9.851 ms - 31 GET /assets/css/bootstrap.min.css 404 1.837 ms - 41 GET /assets/css/bootstrap-theme.min.css 404 0.569 ms - 47 GET /assets/css/custom.css 404 0.787 ms - 34 GET /assets/libs/angular/angular.min.js 404 0.458 ms - 47 GET /app/app.modules.js 404 0.639 ms - 31 GET /app/services/services.js 404 0.560 ms - 37 GET /app/controllers/controllers.js 404 1.474 ms - 43 GET /app/filters/filters.js 404 0.662 ms - 35 GET /app/directives/directives.js 404 1.853 ms - 41 GET /assets/js/jquery.min.js 404 3.824 ms - 36 GET /assets/js/bootstrap.min.js 404 0.804 ms - 39 GET /assets/libs/angular/angular-bootstrap.min.js 404 0.624 ms - 57 GET /assets/libs/angular/angular-bootstrap-prettify.min.js 404 0.721 ms - 66 GET /assets/img/logo.png 404 0.465 ms - 39 GET /favicon.ico 404 1.216 ms - 24

The " views " work , but the assets "and the application " > do not work .

How to configure the "service-static" part for work? Should I still need a route, although it is listed for serving static files? Should I still configure the route and execute "sendFile"?

Thanks!

/////////////////////////

Update:

/////////////////////////

I tried this:

  ... //PATHS: var viewsPath = path.join(__dirname, '..', 'views'); var appPath = path.join(__dirname, '..', 'app'); var assetsPath = path.join(__dirname, '..', 'assets'); ... //SERVE-STATIC: app.set('views', viewsPath); app.use(serveStatic('app', appPath)); //<--- Changed app.use(serveStatic('assets', assetsPath)); //<--- Changed ... //ROUTES: // serve index and view partials app.get('/', routes.index); //Partials app.get('/partials/:name', routes.partials); ...

And also renamed "app.modules.js" to "app-modules.js", but it didn’t work: / Still getting a lot of 404's:

 GET / 200 645.235 ms - 1867 GET /assets/css/app.css 404 9.209 ms - 31 GET /assets/css/bootstrap.min.css 404 2.609 ms - 41 GET /assets/css/bootstrap-theme.min.css 404 1.297 ms - 47
+5
source share
1 answer

To get the desired behavior, change this:

 app.use(serveStatic(appPath));

... to that:

  app.use('/app', serveStatic(appPath));

Earlier code indicates the static content of your app directory, but it does not include part of the app path. It basically means "Treat everything in appPath as if it were a docroot." So, to get (e.g. app/server.js ) in your web browser, you simply go to http://example.com/server.js and not http://example.com/app/server.js . app.use() specifying the path in app.use() , you will get the desired behavior.

+3
source

More articles:


All Articles