Develop Reference

Javascript files not loading when hosting a website on digital ocean

I've built a web app with an express backend and using the ejs view engine.
When I run it on my computer it works fine but I'm trying to host in on digitalocean. I cloned it to the droplet(Ubuntu 22.10 x64) and served it on port 80. When I visited it in the browser at 46.101.145.210:80, I got these errors.
GET https://46.101.145.210/javascripts/cookieHandler.js net::ERR_CONNECTION_REFUSED
GET https://46.101.145.210/javascripts/domain.js net::ERR_CONNECTION_REFUSED
Here's my file structure,
Here's the code in index.js.
const express = require("express");
const app = express();
const fs = require("fs");
const path = require("path")
const assert = require("assert");
const PORT = 80
app.use(express.json());
app.use(express.urlencoded({extended: true}));
app.use(express.static('public'));
app.set("view engine", "ejs")
app.listen(PORT, () => {
console.log("Server running on port " + PORT.toString());
});
const domains = ... // Not important
app.get("/", (req, res) => {
res.render("index")
//res.redirect("/domain")
})
app.get("/domain", (req, res) => {
res.render("domain", {domains: domains})
})
I've tinkered with the firewall config and the express.static to see if it would make a difference. I couldn't figure anything out though.
Update: I've checked the requests out a bit. They are https requests. When I use postman and change the request to be http it works.

I solved it by adding a valid ssl certificate.

Looking your file structure and the code, I can say, you must define the full path of the public directory using
express.static(__dirname+'/public')
Or can be like
const path = require('path');
// .... your code ...
app.use(express.static( path.join(__dirname, 'public') ));
with this you are forcing to define where the public directory is on the ubuntu, and validate you are accessing your files
Hope you can solve with this
Update: checking carefully, I can see that your are trying to request using https, but your code is working on port 80 (http), so you said, on postman worked without https because of the port. If you want to have working your code with port 443 (https), you must have a certificate (with domain but not required), then try with https://46.101.145.210/javascripts/cookieHandler.js otherwhise try http://46.101.145.210/javascripts/cookieHandler.js.

Create React App production build not listening to backend API

I have a backend Node API Express server and a React app in two separate folders (one for backend, one for React app). My backend runs on localhost:8000 and on my React app I have a proxy to this target via a setupProxy.js file using http-proxy-middleware. When I run the react app locally on localhost:3000, it can send requests to my backend correctly.
However, when I run yarn build on my React app for production, it doesn't seem to work. On the React app's repo, I have installed Express to serve the static files on localhost:9000. When I try to make a call to the backend, it just returns the index.html of the build folder. I'm wondering if I am doing something wrong or if I am missing something. What I would like is:
When user goes on localhost:9000, it shows the index.html of the build folder.
When a user clicks a button, it should send a request to localhost:8000, rather than sending back the index.html.
Here are some files in case it is needed:
src/setupProxy.js (this is on the React app)
const proxy = require('http-proxy-middleware');
module.exports = function(app) {
app.use(proxy('/auth/google', { target: 'http://localhost:8000/' }));
app.use(proxy('/api/**', { target: 'http://localhost:8000/' }));
};
server.js (also on React app, to serve the build folder)
const express = require('express');
const path = require('path');
const app = express();
app.use(express.static(path.join(__dirname, 'build')));
app.get('/*', (req, res) => {
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
app.listen(9000, () => {
console.log('Listening on port 9000.');
});

Have you added the dependency of cors in your node API.
It is needed when we are communicating to different type of environment

Node.js/express.js default routing changes not being seen in ubuntu

EDIT ------------
so I figured out the issue, restarting and reloading nginx didn't have any effect, but if I stoped the nginx instance, then restarted it, any changes I made to the server files took effect. It's great that I figured it out, but could anyone give me some insight into why this is? It's better if I understand why this was happening. Any changes I made to the client side files such as the html files took affect immediately, it was only the server files that I had to stop then restart the nginx instance for it to take affect.
ORIGINAL POST BELOW----------------------
Any changes I make to the server side files of my deployed Node.js app with express.js isn't being seen by ubuntu. Basically, I have a mean app deployed on ubunut, it is a multipage page app, with only one of those pages having partials, so i use my routes.js
to catch the routes and send them to my main.js file to tell express and node which html or ejs file to load.
I made changes to the version on my computer so that all other routes would go to a certain html, it works great. But I pushed my changes to github, then pulled them in my ubuntu instance, and it's not working. All other changes I made to the project during this time that were pushed with it have taken affect. But, it's like ubuntu isn't letting node see any changes to the routes.js file, the code is there, I've even altered it with 'vim' from my terminal, but any changes I make, even ones that should break it, aren't seen by node. And going to an unexpected route displays the 'cannot GET...' page.
I've wracked my brain, but i'm stumped, the code is there and I can change it, I've altered html pages via vim to test it. But both, the routes.js file that handles my routing and my server.js file aren't reflecting my changes, even when I change things that should break it. Any ideas? Let me know if you need anymore info, i've included my files below. Also, I use nodemon so that it restarts automatically anytime changes are made
SERVER.JS FILE -------------------------------
var express = require('express'),
app = express(),
path = require('path'),
bodyParser = require('body-parser')
app.use(bodyParser.urlencoded({extended: true}))
app.use(bodyParser.json())
app.use(express.static(path.join(__dirname, './client')))
app.use(express.static(path.join(__dirname, './client/views')))
app.use(express.static(path.join(__dirname, './bower_components')))
app.set('views', path.join(__dirname, './client'));
app.set('view engine', 'ejs');
require('./server/config/routes.js')(app)
var port = 8000
app.listen(port, function(){
console.log('Server on port: ' + port)
})
ROUTES.JS FILE -----------------------------
var Main = require('../serverControllers/main.js')
module.exports = function(app){
app.get('/', Main.main)
app.get('/contact', Main.contact)
app.get('/algorithms', Main.algorithms)
app.get('/projects', Main.projects)
app.get('*', Main.other)
app.use(Main.other)
}
MAIN.JS FILE ----------------------
module.exports = {
main: function(req, res){
res.render('index')
},
contact: function(req, res){
res.render('contact')
},
algorithms: function(req, res){
res.render('algorithms')
},
projects: function(req, res){
res.render('projects')
},
other: function(req, res){
res.render('default')
},
}

MEAN app. Two servers at the same time Express, NodeJS, Angular 2

I try to connect backend (NodeJS, Express) with Frontend (Angular 2), but have a problem.
When I start two servers separately, both client-side and server-side work fine.
In my situation:
localhost:4200 - Angular
localhost:3000 - NodeJS, Express
When I render any static html file in my VIEWS folder, it works correctly, but when I change the content of the html file to Angular Index.html, that uses components, it doesn’t work. I mean, it works, but doesn't load my components.
I suppose that problem is in the configuration, and my index.html doesn't know how to find and load components, but I don’t understand exactly where a mistake might be.
When I try to start both servers at the same port, my frontend part stops working.
I use Angular-CLI, NodeJS, Express and EJS.
My server.js code is:
var express = require('express');
var path = require('path');
var bodyParser = require('body-parser');
var index = require('./routes/index');
var tasks = require('./routes/tasks');
var port = 3000;
var app = express();
app.set('views', path.join(__dirname, 'views'));
app.set('view enjine', 'ejs');
app.engine('html', require('ejs').renderFile);
app.use(express.static(path.join(__dirname, 'views')));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false}));
app.use('/', index);
app.use('/api', tasks);
app.listen(port, function () {
console.log('Server started on port ' + port);
});
In the ROUTES folder my index.js code is:
var express = require('express');
var router = express.Router();
router.get('/', function(req, res, next) {
res.render('index.html');
});
module.exports = router;
My folders structure:
Picture of foldes
node_modules
routes
ruen-app
views
package.json
server.js
ruen-app is my client (Angular 2) folder.
So, my questions are:
How to connect these two parts?
Is it correct to start two servers at the same time - one for the frontend, another for the backend?
What is the best practice for MEAN applications to start from the scratch? I mean, what is the best way - two servers or one?

Spent 3 days, but found the solution.
On the stackoverflow:
Different ports for frontend and backend. How to make a request?
Angular-CLI proxy to backend doesn't work

Webpage cannot find certain files

I am building a simple sandbox/practice style website on heroku I am trying to learn nodejs and I am learning Angular. After much hit and miss I got the server to load my home.html page, however it cannot seem to find my vendor scripts. Such as my angular, contollers, and some images/css.
The path I have setup for angular is: <script src="/vendor/angular.min.js"></script>
<script src="/controller.js"></script>
This is coming from a localhostconnection by the way, so http://localhost Here is an example of what my simple index.js in node looks like:
var express = require("express");
var app = express();
app.set("port", (process.env.PORT || 5000));
app.engine('html', require('ejs').renderFile);
app.set('views engine', 'html');
app.use(express.static(__dirname + "/public"));
app.get("/", function(request, response) {
response.render("home.html");
});
app.listen(app.get("port"), function() {
console.log("Node app is running at localhost:" + app.get("port"));
});
this is located in the root of the webfiles and it points to a views folder which includes my home.html (how I got my home page to finally load) However it still says it cannot find my vendor scripts.
These are located inside their own vendor folder that is in the root folder, and the views folder is also its own folder in the root folder the setup is like so:
-views
---home.html
-vendor
--some vendor folders(bootstrap etc)
---angularjs.js and other vendor scripts
I am sure I am missing something simple here, but I am a beginner with nodejs and still learning at this point. Thank you ahead of time for the help, and let me know if I can offer anymore information.