JavaScript file net::ERR_ABORTED 404 (Not Found) - javascript

I would like to add some backend functionality for payment option for my small Firebase web app. My project has the following structure.
project
| functions (cloud functions here)
| --server.js
| static (all JavaScript files for frontend, css, images)
| --style.css
| --index.js
| --images
| index.html
| other HTML files
Here is what I have inside my server.js file. I am getting net::ERR_ABORTED 404 (Not Found) for all my JavaScript files. What should I do here?
const express = require('express');
const app = express();
app.set('view engine', 'ejs');
app.use(express.static('../../project'));
I noticed the following two possible posts that might help me, I tried some top answers from there but still stuck, do not actually understand where is the problem and what has to be done.
JS file gets a net::ERR_ABORTED 404 (Not Found)
How do I use HTML as the view engine in Express?

The problem I noticed here is this line app.use(express.static('../../project'));
What you are doing is setting the folder project to public. Your JS files are inside a static folder, and they do not get read. I would suggest the following structure:
project
server.js
static (folder)
HTML (folder for all HTML files)
css (folder for all css files)
js (folder for all js files)
Then in your server.js file:
const express = require('express');
const app = express();
app.set('view engine', 'ejs');
app.use(express.static('./static'));

Related

Node JS get 404 error not found when i try to access to a js file

I'm trying to access a js file from my index.html file, but I'm getting this error:
GET http://localhost:3000/js/script.js net::ERR_ABORTED 404 (Not Found)
I know there are several posts about this issue but I still can't find a solution.
So here is my folder structure:
Game
|-- Client
| |--Js
| |--script.js
|
|-- Server
|-- server.js
This is the few lines in my server.js:
var app = require('express')();
var http = require('http').Server(app);
app.use("/js", express.static('./client/js/'));
And this is a part of my index.html:
<script src="js/script.js"></script>
You are telling your express server to serve the folder 'Server/client/js' at route 'localhost:3000/js'.
If your folder structure is what you say it is, then you would get this error, since there is no such folder.
The most straightforward way of fixing this would be to move your client folder into your Server folder and change your static folder destination to './Client/js'.

Cannot GET /blah.html - .ejs can't load html?

I'm using Nodejs and Express to create a dynamic webpage.
I have a home.ejs file that has this iframe:
<iframe id="newstable" src="/news_tables/2018-08-04.html" height="1000" width="100%"></iframe>
My folder directory is:
News_Aggregator (includes app.js)
News_Aggregator/news_tables (includes a bunch of html files, e.g. `2018-08-04.html`)
News_Aggregator/views (includes my `home.ejs` file)
And my app.js:
const express = require('express');
const app = express();
app.set("view engine", "ejs");
app.get('/', function(req, res){
res.render('home.ejs');
});
app.listen(8000, () => {
console.log('Example app listening on port 8000!')
});
However, when home.ejs is rendered, my iframe doesn't load the html page:
This works in "normal" HTML. What am I missing to get the .ejs file to find this and render correctly?
You get the error because the server dosen't know where to get the files from.
First You must define where the static .ejs files will be. Lets say something like this. if your files are in a public folder(ejs,css etc) and you will get them from there. Setup both with:
app.use(express.static(__dirname + '/public'))
app.set('views', path.join(__dirname, '/public'));
from here you can just in your response if you have a home.ejs file
res.render('home', {});
You should look over Express static() from here and learn how to serve files
The fact your HTML is generated from a .ejs file is irrelevant.
Your HTML says the browser should ask the server for the URL /news_tables/2018-08-04.html.
Your HTTP server has a route app.get('/', and no other routes.
Your HTTP server doesn't know about the URL /news_tables/2018-08-04.html, so it returns a 404 Not Found.
You need to write code which will serve up all the URLs you want it to.
You should probably look at the Express static() middleware if you want to serve static files.
The only thing that works is removing ".html" from address "localhost:3000/index.html".

create-react-app build service-worker.js and manifest.json not found

I have created an app with create-react-app. I have built it and I have written a simple express app for serving the react built app.
I have some problems with the static files and the files which are in the root folder of express app, (e.g. manifest.json, service-worker.js). Now I get 404 on both these files.
How can I treat this files in express? They must be in the static folder? I have to modify the react app?
I went to see the file generated by the react build, in which the file 'service-worker.js' is imported and the string starts with '/' (that is '/service-worker.js')
(I have not touch the files for the pwa since I created the project)
Here there's my root folder of my express app
I have only added the project.json and the index.js (and obviously the node_modules), the other files are those from the react build.
Here my express app:
const compression = require('compression');
const bodyParser = require('body-parser');
const express = require('express');
const app = express();
app.use('/sketches', express.static('sketches'));
app.use('/static', express.static('static'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.use(compression());
app.get('/', (req, res) => res.sendFile(__dirname + '/index.html'))
app.listen(process.env.PORT || 3000, () => console.log('server listening!'))
Adding this line of code I get the service-worker.js but I can't get the files in the sketches folder.
app.use('/', express.static(__dirname));
I had a same problem i resolved it by following these steps.
warning: i am new to these technologies and i don't know much about web security. this maybe not the best way of doing it.
i get it work using ejs template engine and express but it should work in your case as well.
1) create-react-app
2) yarn build
3) copy static folder into public
4) copy service-worker.js inside static folder also
5) go inside main Ctrl + f
6) type /service-worker.js in search hit Enter
7) you will see somthing like that var e="/service-worker.js";
8) change into var e="/static/service-worker.js
9) finally open service-worker.js change /index.html to /
precacheConfig=[["/","d6be891ca003070326267be1d2185407"]

Node and Express can't find my js folder [duplicate]

This question already has an answer here:
nodejs express not to intercept messages for a folder with static content
(1 answer)
Closed 7 years ago.
I have a folder structure for my Node.JS app
/
|-js
|-ajax.js
|-img
|-css
|-views
|-index.html
|-router
|-main.js
|-node_modules
|-server.js
My server.js file looks like
var express=require('express');
var app=express();
require('./router/main')(app);
app.set('views',__dirname + '/views');
app.set('view engine', 'ejs');
app.engine('html', require('ejs').renderFile);
var server=app.listen(3000,function() {
console.log("Express is running on port 3000");
});
I am very new to Node and Express. When I try to include a js file within my index.html (inside views), it says the file can't be found. I don't understand why
../js/ajax.js
is unable to be found from my index.html
I think the same issue is happening with my css files.
You need to set your js directory as static.
app.use(express.static('js'));
http://expressjs.com/starter/static-files.html
However I would recommend doing this with your directory structure:
-static
-js
-ajax.js
-img
-css
-views
-router
And then
app.use(express.static('static'));

Localhost not working with node js

Following is a small server (app.js) which is is simply calling index.jade file to add jquery.js, underscore.js and backbone.js for later use. But its not working.
My directory structure is:
base
app.js
public
jquery.js
underscore.js
backbone.js
theapp.js
views
index.jade
My app.js file is:
var express= require("express"),
http = require("http"),
path = require("path");
var app= express();
app.use(express.static(__dirname+ "/public"));
app.get("/", function(req, res){
res.render("views/index.jade");
});
app.listen(3000);
My index.jade file is:
#main
script(src= "jquery.js")
script(src= "underscore.js")
script(src= "backbone.js")
script(src= "theapp.js")
When I run localhost:3000 in the browser, it says: Error: Failed to lookup view "views/index.jade"
(Localhost is working fine with another node.js program)
Please help. Thanks a lot!
Dont include the .jade
res.render("views/index");
Assuming your view engine is already setup to use Jade. (app.set('view engine', 'jade');)
You also probably dont need to specify the "views" folder, check for the line
app.set('views', path.join(__dirname, 'views'));
in your app.js - this is the root directory for your views, so you'll only need:
res.render("index");

Categories