CSS throwing 503 error with node.js on a2hosting

user_7075904 0
Viewed 355

I followed this great tutorial on setting up node.js on a2hosting: https://www.youtube.com/watch?v=BAD5JyOymRg

everything seems to work except for the CSS does not load in Firefox or Chrome and throws a 503 error for some reason. It also throws a 503 error if I point the href to no file at all. I have tried changing the href link to /stylesheets/style.css or moving style.css around but have not had any luck.

Any help would be greatly appreciated!

server.js:

var express = require('express');
var app = express();
var path = require('path');

app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

app.use('/testapp/static', express.static('public'));

app.get('/testapp', (req, res) => {
  res.render('index', { title: 'Express' });
});

app.listen();

package.json:

{
  "name": "app",
  "version": "1.0.0",
  "description": "My App",
  "main": "app.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "dependencies": {
    "express": "^6.14.7",
    "ejs": "~2.6.1"
  },
  "author": "",
  "license": "ISC"
}

index.ejs:

<!DOCTYPE html>
<html>
    <head>
        <link rel='stylesheet' href='http://*mysite*.com/testapp/static/stylesheets/style.css' />
    </head>
    <body>
        <h1>Hello <%=title%></h1>
    </body>
</html>

style.css:

body {
   background-color: red;
}

Here's the folder structure:

testapp
-public
--stylesheets
---style.css
-views
--index.ejs
-server.js
-package.json
-node_modules
express node.js hosting css
3 Answers

  1. Please, make sure that your testapp is a correct Application URL (not Application root)

    ExpressJS configuration panel

  2. Your starting file is called server.js, however your package.json refers to app.js. Don't you have some additional files which may work instead of the one you think? Please, check the Application startup file is correct.

  3. If the first options didn't help, check the .htaccess file configurations in your /home/<username>/public_html directory according to the instructions https://www.a2hosting.com/kb/installable-applications/manual-installations/installing-node-js-on-managed-hosting-accounts#Integrating-a-Node.js-application-with-the-web-server

Please let me know if some of the options were helpful or you need some additional information or research.

user_48964930

If you are able to see html and not CSS, try tweaking second parameter where you specify the directory location.

app.use('/testapp/static', express.static('public'));

The path that you provide to the express.static function is relative to the directory from where you launch your node process (link).

I had provided a sample code which you could refer where I had put one folder inside the directory and one outside. - https://codesandbox.io/s/sweet-grass-0dxvh?file=/testapp/server.js

user_41641670

Change From

app.use('/testapp/static', express.static('public'));

to

app.use('/testapp/static', express.static(path.join(__dirname, 'public')));

For express serving static files see link1 & link2.

user_65241380
Related