js file not found on Heroku - node.js

My socket.js file can not be found when my Node.js server runs on Heroku, however when it runs on localhost, it is found. In addition, although the app.js file is in the same directory with socket.js file, it can not be found. I've seen some posts suggesting to use
app.use('/', express.static(__dirname));
but i guess it is not the case here.
my index.html file :
<script src="/angular-socket-io/socket.js"></script>
<script src="/socket.js"></script>
<script src="/socket.io/socket.io.js"></script>
Amongst them, the only one couldnt be found is the second directory(/socket.js) which contains the 'socket factory'inside.
My folder tree is as follows;
-app
--assets
---app.js
---socket.js
Any help please?

Just add app.use(express.static(path.join(__dirname, 'app/assets'))); to your main code and after that you can use <script src="/socket.js"></script>

My JavaScript file didn't initialize because of how I imported the JQuery script inside of my index.html.
If your JavaScript file that contains JQuery is not initialized. Make sure to import it with HTTPS not HTTP.
WRONG :
<script src="http://code.jquery.com/jquery-3.5.1.js"></script>
CORRECT :
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
This solved my problem of missing the JavaScript file on Heroku.

Related

How to link script file in footer.ejs?

I want to link script.js to my project.
I write folowing code on
footer.ejs:
<script src="../static/js/script.js"></script>
But I got error:
Cannot GET /static/js/script.js
How can I fix it?
This is most likely due to a path typo somewhere.
For example, if in your app.js you use app.use(express.static(__dirname + '/static/')); Then in your script tag you would need to use <script src="js/script.js">
If you changed your app.js to app.use(express.static(__dirname + '/static'));
Then you would need to use <script src="/js/script.js"></script>
Check everywhere that you reference that file and make sure you have the correct filepath.

Include files in a .ejs file

I am trying to use Express for my Node.js server. I put my web page in /views/page.ejs as required. Yet, I have something like this in my code.
<script type="text/javascript" src="jsfile1.js"></script>
<script type="text/javascript" src="jsfile2.js"></script>
<script type="text/javascript" src="jsfile3.js"></script>
<script type="text/javascript" src="jsfile4.js"></script>
I also have a .css file to load.
My question is: how to load them ? I encounter 404 errors. My files are in the same directory as server.js (the Node.js app that I am running).
Thank you for your answers!
Noël.
You will need to include in your server.js, an express static route to the directory where you want to serve the files.
I have my static assets in /public, So the code that I use to include the static files located in /public is:
app.use(express.static(path.join(__dirname, 'public')));
With that static route in place, if you had a file /public/stylesheets/test.css, then you would reference the file like this in your .ejs:
<link rel="stylesheet" href="stylesheets/style.css">
Hope that helps!

External script error in socket.io server

I'm having a problem, whenever I try to import a local script:
<script src="socket.io/socket.io.js"></script>
<script src="http://code.jquery.com/jquery-1.11.1.js"></script>
<script src="ace-builds/src-noconflict/ace.js" type="text/javascript" charset="utf-8"></script>
<script>
var editor = ace.edit("editor");
var socket = io();
editor.getSession().on('change', function e() {
socket.emit('editor-change', editor.getValue());
});
socket.on('editor-change', function(val) {
edit.setValue(val);
});
</script>
Everything gets imported fine except the ace-builds which is in the correct directory. Here's an image of the error:
I don't understand why I'm getting this error (404) because all these files (including the server scripts) are hosted in the same directory as the file giving off the 404 error.
By default node.js does not serve any files. If you want it to serve files, then you either have to set up specific routes to serve specific files or use a module like express-static that can serve directories of files for you.
You can read more about serving static files here: http://expressjs.com/starter/static-files.html

Socket IO, in which directory should i save my static javascript files

I am trying to include jquery in my socket io served file which is served like this -
app.get('/:file', function(req, res){
res.set('Content-Type', 'text/html');
res.sendfile('shrib.html');
});
Now in shrib.html when i try to send -
<script type="text/javascript" src="/jquery-1.11.0.min.js"></script>
or
<script type="text/javascript" src="jquery-1.11.0.min.js"></script>
I get the error of jquery not found, but when i try to use the CDN version of jquery it runs fine. In my directory structure i have the jquery-1.11.0.min.js in both the main directory and also in the node_modules directory yet i don't see it and get error like this -
Uncaught SyntaxError: Unexpected token < jquery-1.11.0.min.js:1
Uncaught ReferenceError: $ is not defined
did You mistaken socket.io with express?
Because Your problem looks like its related to express, not socketio, and i see no sockets here...
If yes, You should set static files like this:
app.use('/js', express.static(__dirname + '/js'));
put all js files in your project/js folder, and then do:
<script type="text/javascript" src="/js/jquery-1.11.0.min.js"></script>

How to change the folder where socket.io is fetching the socket.io.js JavaScript file?

The statement
<script src="/socket.io/socket.io.js"></script>
looks for socket.io.js in the 'public' folder instead of node_module.
Changing the url to ../node_module/socket.io/socket.io.js does not work.
How do I change the default folder which src looks into?
socketio sever when receives the request '/socket.io/socket.io.js' , it dynamically builds the content ( considering the transports configured to be supported by the server ).
The file is neither served from public / node modules.

Resources