link sails.io.js in angular2 - node.js

I'm having trouble using sails.io.js with angular2. I use the angular2-sails library.
First I decided to use with a code inside my app.component.ts
this._sailsService.connect(this.url);
It works but when I launched the app I also have those messages "Socket is trying to reconnect to Sails.." I checked, it's trying to connect to port 4200.
I used sails.io.js with
"scripts": ["sails.io.js"]
in angular-cli.json. But I tried something else :
<script src="sails.io.js"> // I also tried src="src/sails.io.js
</script>
<script type="text/javascript">
io.sails.useCORSRouteToGetCookie = false;
io.sails.url = 'http://localhost:1337';
</script>
in index.html, and my browser returns that it cannot load the script at "http://localhost:4200/sails.io.js" or "http://localhost:4200/src/sails.io.js"
folders :
app.js
angular-cli.json
src
-index.html
-sails.io.js
-app
--app.component.ts
I don't know why it tries to connect to 4200 when it's called in the angular-cli.json and why it can't access my sails.io.js when called in the index.

Related

Express can't find Webpack bundle

So I've been configuring a MERN app with a main package that runs an Express server, and a client folder which contains the React front end and has its own package. To test the client I've been using webpack-dev-server to run an HTML file within the client/public folder that links a Webpack bundle in a dist folder. The HTML file:
<!DOCTYPE html>
<html>
<head>
<title>React Config</title>
</head>
<body>
<div id="root"></div>
<script src="../dist/bundle.js"></script>
</body>
</html>
The relative path for the bundle is correct, and it works fine using WDS. However, when I try to serve this file via my Express server, I get a 404 error for the bundle file. In my server.js:
app.use(express.static('client'));
const appPage = path.join(__dirname, './client/public/index.html');
app.get('/', function(req, res) {
res.sendFile(appPage);
});
This does serve the HTML file correctly, but when I navigate to the local server it's trying to find bundle.js at http://localhost:3000/dist/bundle.js, instead of http://localhost:3000/client/dist/bundle.js. Furthermore, even when I change the path in the HTML to point to the right location, it 404's anyway.
So 2 questions:
1) How can I configure the paths for the Webpack bundle to be accessible both from WDS run within the client folder and from my Express server in the main package?
2) Why is the bundle not being found by Express even when I alter the path to be correct? I've included the entire client folder as static for the server.
You should not use webpack-dev-server for production, webpack-dev-server not build the index.html file, webpack-dev-server is only for developers.
You can use this command to build it:
webpack --config ./webpack.prod.js --mode production

socket.io including in project and installation

Im want to include socket.io in my project. I installed it using npm install -g socket.io still being in directory my files to the project are located in.
I created script to test if it was successfull
i creater server.js with code
var client=require("socket.io").listen(8080).sockets;
client.on("connection",function(socket){
console.log("Someone has connected")
})
and included in html file
<script type="text/javascript" src="http://127.0.0.1:8080/socket.io/socket.io.js"></script>
I tried to run node server.js to see if there will be message in console but there wasnt , . Whad did i do wrong? I a trying to solve this problem but can find solution. Thanks for helping.
You must initialize a connection in html file (on client side).
If you are trying to connect to the host that serves the page you can use:
var socket = io();
or specify address:
var socket = io.connect('http://127.0.0.1:8080');

js file not found on Heroku

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.

Start nodejs in browser form begining?

I am new in Nodejs and using Mac OS (MAMP, localhost:8888), I have already installed and I can execute programs in terminal. But how to in build with html. Can, we include nodejs as a external library like (jQuery, Bootstrap).
Please refer this Hello world example.
node.js
var http = require("http");
var server = http.createServer(handler);
var fs = require('fs');
server.listen(3003)
function handler(req,resp){
fs.readFile("index.html",function(err,data){
if(err){
console.log("error in loading file.");
resp.end("failed to load")
}else{
resp.writeHead(200);
resp.end(data)
}
})
}
HTML
<html>
<head>
</head>
<body>
Hello world.!!
</body>
</html>
Once you mentioned port number in listen function,
node server will run on that port.So until you are not giving same port number as Apache,you can run both Apache and nodejs parallel.If your Apache and nodejs server sharing same port number , then you need to stop one of them in order to use other.
Your Question :
Can, we include nodejs as a external library like (jQuery, Bootstrap).
Node.js is not library.So you can not include it like jQuery or bootstrap.
It is platform for javascript to run on server side.And using nodejs we can create Server which serve your content of Web like Apache do.
When you say node app.js (insead of app.js it can be any name) from your command prompt,you starting your node server.
In above example index.html you can include your jQuery or angular or bootstrap library as you do when using Apache

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

Resources