atasca10 atasca10 - 2 months ago 9
Javascript Question

Failed to load resource: the server responded with a status of 404 (Not Found) https://websitename.herokuapp.com/js/bootstrap.js

I'm running a node.js server on heroku using the express.js framework.

Here is what my server looks like:

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

app.use(express.static(__dirname + '/static'));
var port = process.env.PORT || 8000;

app.listen(port);


My index.html file has the following javascript links:

<script src="/js/chartview.js"></script>
<script src="/js/bootstrap.js"></script>
<script src="/js/bootstrap-select.js"></script>


My directory system looks like this:

server.js
/static
-index.html
-/js
-bootstrap.js
-bootstrap-select.js
-chartview.js
-/css
-bootstrap.css
-bootstrap-select.css
-styles.css


Chrome displays my html page with the appropriate css styles but the console says:

Failed to load resource: the server responded with a status of 404 (Not Found) https://websitename.herokuapp.com/js/chartview.js
Failed to load resource: the server responded with a status of 404 (Not Found) https://websitename.herokuapp.com/js/bootstrap.js
Failed to load resource: the server responded with a status of 404 (Not Found) https://websitename.herokuapp.com/js/bootstrap-select.js


It loads properly when I change my index.html tags to look like this:

<script src="chartview.js"></script>
<script src="bootstrap.js"></script>
<script src="bootstrap-select.js"></script>


And I change my directory systems to look like this:

server.js
/static
-index.html
-bootstrap.js
-bootstrap-select.js
-chartview.js
-/css
-bootstrap.css
-bootstrap-select.css
-styles.css


This is not Ideal, as I would like to have a /js folder.

Any suggestions will be greatly appreciated!

Answer

From the console error, https://websitename.herokuapp.com/js/chartview.js, the file is not being checked in static folder.

So, change your index.html to include scripts like this.

<script src="js/chartview.js"></script> i.e remove / from beginning. as path is relative to index.html.

Follow same process for other three files.

Also, you mentioned that the CSS files are loaded correctly. Can you show how exactly are you including those css files? i.e the path for css.

Comment here, if that doesn't help.

Comments