how to install socket.io client - javascript

Is it possible to reference socket.io client library with a relative path like:
src="/socket.io/socket.io.js"
instead of
src="https://miweb:6969/socket.io/socket.io.js"
Also to connect the library we do:
var websocket = io.connect ("https://miweb.com:6969");
I have seen some do:
var websocket = io.connect ("/");
As if socket.io were running on the same port and were running on the same project.
What should I do to our server to work this way?

Yes, if your webpage is served from the same location than Socket.io, you can do this:
<script src="/socket.io/socket.io.js"></script>
<script>
var socket = io.connect('/');
socket...
</script>
But if the page is in another domain you should use an absolute url.

Related

Mosquitto and simple Paho JS Client

I am trying to get a simple mqtt broker set up and access it from a web page. I have had pretty much 0 luck.
I've got mosquitto 2.0.14 downloaded and running. Here's my configuration file:
listener 1883
listener 9001
protocol websockets
This generates the following log when I run mosquitto -c mosquitto_conf -v
1637948154: mosquitto version 2.0.14 starting
1637948154: Config loaded from mosquitto.conf.
1637948154: Opening ipv6 listen socket on port 1883.
1637948154: Opening ipv4 listen socket on port 1883.
1637948154: Opening websockets listen socket on port 9001.
1637948154: mosquitto version 2.0.14 running
Here's my html file, which I simply open in the browser. It uses Paho's js client.:
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/paho-mqtt/1.0.1/mqttws31.min.js" type="text/javascript"></script>
<script type="text/javascript" language="javascript">
var mqtt;
var reconnectTimeout = 2000;
var host = "192.168.1.94";
var port = 9001;
function onConnect() {
console.log("Connected");
message = new Paho.MQTT.Message("hello");
message.destinationName = "sensor1";
mqtt.send(message);
}
function mqttConnect() {
console.log("Connecting to " + host + ":" + port);
mqtt = new Paho.MQTT.Client(host, port, "clientjs");
var options = {
timeout: 3,
onSuccess: onConnect,
};
mqtt.connect(options);
}
</script>
</head>
<body>
<script>
mqttConnect();
</script>
</body>
</html>
I'm using a guide from this website: http://www.steves-internet-guide.com/using-javascript-mqtt-client-websockets/
It errors out with the following console error in the browser:
WebSocket connection to 'ws://127.0.0.1:9001/mqtt' failed
I have been having a hard time finding an updated tutorial that works. My ultimate goal is to create a react app that connects to an mqtt broker via websockets and receives messages to update state in redux.
Questions:
How do I get the js client to connect?
How do I set the host for mosquitto? Can I use a diff host like myhost.local or am I stuck using 127.0.0.1 or whatever I see when I run ipconfig (I'm on windows)?
You need to add allow_anonymous true to allow users to connect without supplying a username/password.
This is part of the set of changes introduced in v2.0 to improve the default security posture of mosquitto out of the box.

How to make Node.js listen to specific website and use AWS?

So I'm kind of new to Node.js but i really want to host a website that uses Node.js in the background using Amazon Web Services (AWS). I am using Socket.io and Express.js with Node, and i have a html file with the client side code.
Here's part of each file:
server.js:
var express = require("express");
var app = express();
var http = require("http").Server(app);
var io = require("socket.io")(http);
io.on("connection", function(socket) {
console.log("-- User Connected");
});
//express home page
app.get("/", function(req, res) {
res.sendFile(__dirname + "/index.html");
});
//express listen on 8080
http.listen(8080, function() {
console.log("Running...\nListening on port 8080");
});
index.html (Just the client-side javascript)
<script src = "/socket.io/socket.io.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
var socket = io.connect();
socket.on("connect", function() {
console.log("connected");
});
});
</script>
Everything works great, but i was wondering how i would upload this to a AWS bucket and run it there. I already uploaded the full .html file to a AWS bucket and set up the host, so it opens and runs fine. But how would i go about uploading and running the server.js file? and what would i change in both the client side code (change io.connect() parameters?) and the server.js code (change .listen() to something?) so it runs with AWS?
Any help is much appreciated, thank you!
Buckets are a feature of AWS' simple storage. They only support static files. You can't use them run server side side programs that you wrote yourself.
For that you'll need a different product, such as EC2.
You can run Linux on Amazon EC2 instance.
Guide to get started with Amazon EC2.
Step 1: Create a Github/Bitbucket repository of your project so it can be easily cloned on the server. Private repo in GitHub are paid while in Bitbucket it's free under some conditions.
Step 2: SSH into the server. Clone the project. Install the required packages. Now you can run the node server on EC2 instance as you do on your localhost.
Step 3: AWS provides you with public DNS something like: ec2-**-**-**-**.compute-1.amazonaws.com Now access node server through ec2-52-86-163-5.compute-1.amazonaws.com:3000/
Step 4: To run the node app continuously you need something like forever
You can only use S3 for hosting static websites as described in this example.
If you would like to host your Node.js application on AWS I recommend that you use Elastic Beanstalk as explained in Deploying Node.js Applications to AWS Elastic Beanstalk. The main difference compared to hosting the Node.js application on EC2 is that Beanstalk is a service that provides a runtime environment, i.e. you do not have to set up and manage the operatings system yourself. All you need to do is to package your application and upload it to Beanstalk. Consequently, a launch environment will be created and configured with the AWS resources needed to run your code.
For more information, please read What Is AWS Elastic Beanstalk?

Socket.IO don't load inside TideSDK app

i created a chat app using Node.JS + Socket.IO + TideSDK, actually my Node.JS+Socket.IO server work perfectly through browser, but when a try load the server with my TideSDK app this error happend:
ReferenceError: Can't find variable: io
What's can be happend?
The code below is how i call the server.
<script src="https://mynodeserver.com/socket.io/socket.io.js"></script>
<script>
var socket = io.connect('https://mynodeserver.com/');
</script>

Where is the Socket.IO client-side .js file located?

I am trying to get socket.io (Node library) to work.
I have the server-side js working, and it is listening. The socket.io website states simply:
<script src="/socket.io/socket.io.js"></script>
<script>
var socket = io.connect('http://localhost');
socket.on('news', function (data) {
console.log(data);
socket.emit('my other event', { my: 'data' });
});
</script>
This is nice, however, what JS file am I importing!?!
I went into the node_modules directory, where I installed socket.io through npm, and inside socket.io/lib/ is socket.io.js file. However, this is server-side (uses the phrase require(), which errors on the client).
I have spent an hour looking around and I can't get any client .js file to work.
What am I missing?
I managed to eventually answer this for myself.
The socket.io getting started page isn't clear on this, but I found that the server side of socket.io automatically hosts the .js file on starting node, in the directory specified in the documentation:
"/socket.io/socket.io.js"
So you literally just point to this url regardless of your web app structure, and it works.
I would suggest checking if your node_modules directory is at the top level of your app directory. Also, I do believe you need to specify a port number; you should write something like var socket = io.connect('http://localhost:1337');, where the port number is 1337.
If you did npm install then the client socket.io file is located at node_modules/socket.io-client/dist/socket.io.js
Source: Socket get-started page
The client is available in a few ways:
supplied by the socket.io server at /socket.io/socket.io.js
included via webpack as the module socket.io-client
via the official CDN https://cdnjs.cloudflare.com/ajax/libs/socket.io/<version>/socket.io.js
For the first one, the server can be configured in a couple of ways:
// standalone
var io = require('socket.io')(port);
// with existing server from e.g. http.createServer or app.listen
var io = require('socket.io')(server);

How to run socket.io (client side only) on apache server

I want to run client side of socket.io on my apache server.
I have uploaded the socket.io directory to my web server and tried the simple client connection example from the main site socket.io but its not working. I dont know what do I need to get it work and connect my running server.
I Hope, I have clearly explained my problem.
Thank you.
Copy all the files in socket.io\node_modules\socket.io-client\dist to your apache server for example to the js folder. Then add the socket.io.min.js to your page.
<script src="js/socket.io.min.js" type="text/javascript"></script>
<script type="text/javascript">
var socket = io.connect('http://localhost:3000');
socket.on('news', function (data) {
console.log(data);
});
</script>
Copy the distributable .js to your own javascript folder.
In my case, I'm ussing xampp:
C:\xampp\htdocs\nodejs\node_modules\socket.io\node_modules\socket.io-client\dist

Categories

Resources