so I have this idea in my head where when you run nodejs script it starts http(express) server on port 8080 and regular tcp(net) server on port 1337. And when you connect to tcp server via netcat and send "alert" it runs alert() command on webpage via javascript. Here is the code but the if statement is not working(it is printing data but not alerting on my web browser)
var app = require("express")();
var http = require("http").Server(app);
var io = require("socket.io")(http);
var net = require("net");
app.get("/", function(req, res) {
res.sendFile(__dirname + "/index.html");
});
var server = net.createServer();
io.on("connection", function(sock) {
console.log("Client connected");
server.on("connection", function(conn) {
var remoteAddress = conn.remoteAddress + ":" + conn.remotePort;
console.log("New client: " + remoteAddress);
conn.on("data", function (data) {
console.log(data.toString())
if (data.toString() == "alert") {
console.log("YES ALERT");
io.emit("HELLO");
}
});
conn.once("close", function () {
console.log(remoteAddress + " disconnected");
});
conn.on("error", function (error) {
console.log(remoteAddress + " Error: " + error);
});});
});
server.listen(1337, function() {
console.log("Listening on 1337");
});
http.listen(8080, function() {
console.log("Web server started on 8080");
});
Include socket io client js in your webpage and connect to socket server
<script src="/socket.io/socket.io.js"></script>
<script>
var socket = io('http://localhost:1337');
socket.on('connect', function(){});
socket.on('event', function(data){ alert(data.message) });
socket.on('disconnect', function(){});
</script>
you can Change the server side code, to emit the event to work with my example above.
io.emit("event",{"message":"HELLO"});
Related
I was trying to use socket.io to make a real-time collaboration editor with two different WYSIWYG Editors called summernote and froala. Server and client side both can receive and send content, however, it repeatedly refreshes stuff and I don't know why. Any advice? Thanks!
Here is part of my code:
Server side:
var express = require('express'),
app = express(),
http = require('http'),
io = require('socket.io');
var server = http.createServer(app);
var io = require('socket.io').listen(server);
server.listen(8000);
app.use(express.static(__dirname + '/public'));
console.log("Server running on 127.0.0.1:8000");
// event-handler for new incoming connections
io.on('connection', function (socket) {
// first send the history to the new client
socket.on("summer_change", function (data) {
io.sockets.emit('summer_change', {content: data.content});
});
socket.on("text_change", function (data) {
io.sockets.emit('text_change', {content: data.content});
});
});
Client:
document.addEventListener("DOMContentLoaded", function() {
// get canvas element and create context
var socket = io.connect();
var text = {
text: ''
};
$(function() {
$('#text').froalaEditor()
});
//Update summer
$('#summernote').on('summernote.change', function(we, contents, $editable) {
console.log('summernote content is changed:'+$('#summernote').summernote('code'));
var contents = $('#summernote').summernote('code')
socket.emit("summer_change",{content:contents});
});
// Change summer content from server
socket.on("summer_change", function (data){
console.log("Back from server! ");
$('#summernote').summernote('code', data.content);
});
$('#text').froalaEditor().on('froalaEditor.contentChanged', function (e, editor) {
var contents=editor.html.get();
socket.emit("text_change",{content:contents});
})
socket.on("text_change", function (data){
console.log("Back from server! ");
$('#text').froalaEditor('html.set', data.content);
});
});
i am facing problem (i really frustrated), while i connecting the io.on function. i am using express,ioredis and socket.io. redis working properly but socket.io is not working. it is'nt working.please help.
var app = require('express')();
var server = require('http').Server(app);
var io = require('socket.io')(server);
var Redis = require('ioredis');
var redis = new Redis();
//port connection
server.listen(3000);
console.log('server listening 3000');
//redis sub (working fine)
redis.subscribe('test-channel', function () {
console.log('Redis: test-channel subscribed');
});
//this code is not working (stop execution)
io.on('connection', function(socket){
console.log("new client connected");
});
io.on('connection', function (socket) {
console.log("new client connected");
redis.subscribe('message');
console.log("redis start");
//send message to frontend
redis.on("message", function(channel, message) {
console.log("mew message in queue "+ message + "channel");
socket.emit(channel, message);
});
//close socket
socket.on('disconnect', function() {
redis.quit();
console.log('redis disconnected!');
});
});
Client side
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script src="https://cdn.socket.io/socket.io-1.3.4.js"></script>
<script>
var socket = io.connect('http://localhost:3000');
socket.on('message', function (data) {
$(".progress-bar").css('width',+data+'%');
alert('connection established');
$("#messages").append( "<p>"+data+"</p>" );
});
</script>
Server side
var express = require('express');
var app = express();
var server = require('http').createServer(app);
var io = require('socket.io').listen(server); // it was require('socket.io')(server);
server.listen(3000);
Client side
io.sockets.on('connection', function(socket){
console.log("new client connected");
});
const { Server } = require("socket.io")
const io = new Server(server)
While trying to setup a simple NodeJS server and Socket.io client to test something with WebSockets, I've stumbled into something stupid. I'm pretty sure it's something stupid I've done because I've worked with NodeJS/Socket.io before and never had this problem.
With the code below, I'm able to receive the 'tick' event from the server on the client, but the server seems unable to receive the 'ping' event from the client. 'tick' was used to make sure server->client worked, and 'ping' to test client->server.
Using latest Socket.io (1.4.6) and express (4.14.0)
server.js:
var express = require('express');
var app = require('express')();
var server = require('http').createServer(app);
var sio = require('socket.io')(server);
var path = require('path');
app.use(express.static(path.join(__dirname, 'public_html')));
// Socket.io
sio.on('connection', (socket) => {
// Store socket ID
var socketID = socket.conn.id;
// Log connection
console.log('Connection:', socketID);
// Ping event
socket.on('ping', (message) => {
console.log('Ping:', socketID, '-', (message || '(no message>'));
});
// Tick event
var tick = function(){
var now = new Date().getTime().toString();
socket.emit('tick', now);
}
setInterval(tick, 5000);
// Disconnect event
socket.on('disconnect', () => {
console.log('Disconnected:', socketID);
});
});
server.listen(4100, () => {
console.log('Listening on :4100');
});
index.html:
<!DOCTYPE html>
<html>
<head>
<title>Websockets Benchmark</title>
</head>
<body>
<script src="/socket.io/socket.io.js"></script>
<script>
// Socket.io
var sio = io();
// Connection event
sio.on('connect', () => {
console.log('Connected');
sio.emit('ping', 'on connect');
});
// Tick event
sio.on('tick', (time) => {
console.log('Tick', time);
});
// Error event
sio.on('error', (e) => {
console.error(e);
});
</script>
</body>
hope i understood your question...
i did some work with chat by using socket.io so maybe it will help you.
here it is:
<div class="searchBox" style="height: 600px ; width: 500px">
<div style=";width:400px;border-right:1px solid black;;overflow:scroll-y;">
<b style="color: black ;text-decoration: underline">USERS:</b>
<div id="users" style="color: black"></div>
</div>
<div style=";width:300px;height:250px;overflow:scroll-y;padding:10px;">
<b style="color: black ; text-decoration: underline">CONVERSATION:</b>
<div id="conversation" style="color: black"></div>
<input id="data" style="width:200px;" />
<button id="datasend" style="color: #0f0f0f;">send</button>
</div>
and the js:
var socket = io.connect('http://localhost:8080');
// on connection to server, ask for user's name with an anonymous callback
socket.on('connect', function(){
// call the server-side function 'adduser' and send one parameter (value of prompt)
socket.emit('adduser', prompt("What's your name?"));
});
// listener, whenever the server emits 'updatechat', this updates the chat body
socket.on('updatechat', function (username, data) {
$('#conversation').append('<b>'+username + ':</b> ' + data + '<br>');
});
// listener, whenever the server emits 'updateusers', this updates the username list
socket.on('updateusers', function(data) {
$('#users').empty();
$.each(data, function(key, value) {
$('#users').append('<div>' + key + '</div>');
});
});
// on load of page
$(function(){
// when the client clicks SEND
$('#datasend').click( function() {
var message = $('#data').val();
$('#data').val('');
// tell server to execute 'sendchat' and send along one parameter
socket.emit('sendchat', message);
});
// when the client hits ENTER on their keyboard
$('#data').keypress(function(e) {
if(e.which == 13) {
$(this).blur();
$('#datasend').focus().click();
}
});
});
server:
var app = require('./app');
var http = require('http');
var server = http.createServer(app);
var io = require('socket.io').listen(server);
server.listen(8080, function() {
console.log("Gym Project is listening to: http://127.0.0.1:8080");
});
// routing
app.get('/', function (req, res) {
res.sendfile(__dirname + '/index.html');
});
// usernames which are currently connected to the chat
var usernames = {};
io.sockets.on('connection', function (socket) {
// when the client emits 'sendchat', this listens and executes
socket.on('sendchat', function (data) {
// we tell the client to execute 'updatechat' with 2 parameters
io.sockets.emit('updatechat', socket.username, data);
});
// when the client emits 'adduser', this listens and executes
socket.on('adduser', function(username){
// we store the username in the socket session for this client
socket.username = username;
// add the client's username to the global list
usernames[username] = username;
// echo to client they've connected
socket.emit('updatechat', 'SERVER', 'you have connected');
// echo globally (all clients) that a person has connected
socket.broadcast.emit('updatechat', 'SERVER', username + ' has connected');
// update the list of users in chat, client-side
io.sockets.emit('updateusers', usernames);
});
// when the user disconnects.. perform this
socket.on('disconnect', function(){
// remove the username from global usernames list
delete usernames[socket.username];
// update list of users in chat, client-side
io.sockets.emit('updateusers', usernames);
// echo globally that this client has left
socket.broadcast.emit('updatechat', 'SERVER', socket.username + ' has disconnected');
});
});
this is a very simple chat with some clients...
may it helps :)
Can't tell if the ping event is taken by Socket.io, or the following line caused an issue:
console.log('Ping:', socketID, '-', (message || '(no message)'));
Either way, by changing the event name to ev:ping (which is easier to understand anyway), and simplifying that line it's fixed! :)
This question has already been answered, but I can't understand it at all. You can find it at this link.
socket.on calls its callback too many times
I have the same problem as this fellow. I'm attempting to make a chat program with socket.io, but when more than one user joins, each message outputs the number of times of how many users have been connected.
For example, when one user is connected, and he submits a message. It outputs once. When two users are connected, each of their messages output twice.
When three users are connected, each of their messages output three times.
Here is my client side code:
$('document').ready(function() {
var server = io.connect('http://localhost:8888');
$('.chat').keydown(function(event){
var save = this;
if(event.which == 13){
server.emit('message', $(save).val());
$(save).val('');
return false;
}
});
server.on('incoming', function(message){
$('#textfield').append("<p>" + message + "</p>");
});
});
Here is my server side code:
var socket_io = require('socket.io').listen(8888).sockets;
socket_io.on('connection', function(socket){
socket.on('message', function(message){
socket_io.emit('incoming', message)
});
});
Thank you!
You can use socket.broadcast.emit() to send to everyone except that socket:
var io = require('socket.io')(8888);
io.on('connection', function(socket) {
socket.on('message', function(message) {
socket.broadcast.emit('incoming', message);
});
});
UPDATE: The following example works just fine for me:
server.js:
var app = require('http').createServer(handler);
var io = require('socket.io')(app);
var fs = require('fs');
app.listen(80);
function handler (req, res) {
fs.readFile(__dirname + '/index.html',
function (err, data) {
if (err) {
res.writeHead(500);
return res.end('Error loading index.html');
}
res.writeHead(200);
res.end(data);
});
}
io.on('connection', function(socket) {
socket.on('message', function(message) {
socket.broadcast.emit('incoming', message);
});
});
index.html:
<html>
<head>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="/socket.io/socket.io.js"></script>
<script>
$('document').ready(function() {
var server = io.connect('http://localhost');
$('.chat').keydown(function(event) {
if (event.which == 13) {
var $save = $(this);
server.emit('message', $save.val());
$save.val('');
return false;
}
});
server.on('incoming', function(message){
$('#textfield').append("<p>" + message + "</p>");
});
});
</script>
</head>
<body>
<input type="text" class="chat">
<div id="textfield"></div>
</body>
</html>
When pressing enter, the message in the input box is only displayed once to all other connected socket.io users.
Okay, I've finally figured out the problem.
I'm using Express 4.0. That means, I'm using routes to run the server, and I had the socket io code running inside the route. Each time a user connects, it has to go through the route first, and it's all binding onto the same socket_io.
Thanks to everybody who helped!
I also faced it, like multiple socket calls in network tab and i just add this "transports" key object to socket instance, both on client and backend.
socket = io("http://localhost:3002", {
transports: ['websocket']
})
React, Node, AWS EB
Hello guys i'm having a problem in redis pub/sub because my client does not show the message i've published in redis-cli. I used the codes found here in stackoverflow and i made some modification. Here is the link and code. I hope you can help me, my goal is to publish the message to the client index.html using redis publish in redis-cli. I've done this before but i can't make it work again. Thanks in advance guys.
Here is my client index.html
<html>
<head>
<title>PubSub</title>
<script src="/socket.io/socket.io.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<!-- <script src="/javascripts/socket.js"></script> -->
</head>
<body>
<div id="content"></div>
<script>
var socket = io.connect('http://localhost:3000');
var content = $('#content');
socket.on('connect', function() {
});
socket.on('message', function (message){
content.prepend(message + '<br />');
}) ;
socket.on('disconnect', function() {
console.log('disconnected');
content.html("<b>Disconnected!</b>");
});
socket.connect();
});
</script>
</body>
</html>
Here is my server.js
var express = require('express');
var app = express();
var redis = require('redis');
var http = require('http');
var server = http.createServer(app);
var socket = require('socket.io').listen(server);
var publish = redis.createClient();
app.listen(3000);
console.log("Express server listening on port 3000")
app.get('/', function (req,res) {
res.sendfile(__dirname + '/public/index.html');
});
socket.on('connection', function (client) {
var subscribe = redis.createClient();
subscribe.subscribe('pubsub');
subscribe.on("message", function (channel, message) {
publish.send(message);
});
publish.on('message', function (msg) {
});
publish.on('disconnect', function() {
subscribe.quit();
});
});
Redis will not send data to connected clients for you. You must instruct Socket.IO to emit data:
subscribe.on("message", function (channel, message) {
socket.emit('message', message);
});