I am writing this server app (express and socket.io), just at the beginning.
I see double log, so I have double connection to server when starting a tab at localhost:8080.
What am I doing wrong? Is this a Socket.io bug?
const express = require("express");
const path = require("path");
const socket = require("socket.io");
const port = process.env.PORT || 8080;
const app = express();
const server = app.listen(port);
app.use(express.static(__dirname + "/dist"));
app.get("/", (req, res) => {
res.sendFile(path.resolve(__dirname + "/dist", "index.html"));
});
// Socket setup
const io = socket(server);
io.on("connect", function (socket) {
console.log("Made socket connection");
});
The problem was that more js client files were calling socket().
Right method is to import socket.io library in , into your html file, so that this will be available to all js client file, implementing only one connection.
Related
Not working can't find any issue in code##
If I put any port number instead of server it's working but why didn't it's working with socket server anyone explain
I tried some solution but none of them work I want to run socket.io and express on same port number
const express = require('express');
const cors = require("cors");
const socketIO = require('socket.io');
const http = require('http');
const app = express();
const server = http.createServer(app);
const passport = require("passport");
const authRoute = require('./routes/auth');
const userRoute = require('./routes/user');
const PORT = process.env.PORT || 9000;
const db = require('./config/mongoose');
app.use(express.json());
app.use(cors());
app.use(passport.initialize());
require("./config/passport")(passport);
app.use(express.json());
app.use("/api/auth", authRoute);
app.use("/api/user", passport.authenticate('jwt', { session: false }),userRoute);
if(process.env.NODE_ENV === 'production')
{
app.use(express.static('client/build'))
}
Here is the issue if I switch server to any port number it's fine
const io = socketIO(server, {
cors: {
origin: '*',
}
});
let state = {};
io.on("connection", (socket) => {
const { id } = socket.client;
socket.on('disconnect', function () {
console.log('socket disconnected!');
});
socket.on('join_room', function (data) {
console.log('joining request rec.', data);
socket.join(data.room);
io.in(data.room).emit('user_joined', data);
});
socket.on('send_code', function (data) {
io.in(data.room).emit('receive_code', data);
});
});
app.listen(PORT, function (err) {
if(err){
console.log(err);
return;
}
console.log(`Server is up and running on port: ${PORT}`);
});
http.createServer(app) and app.listen() are not compatible as they both try to do the same thing. If you look at the source code for app.listen(), you will see this:
app.listen = function listen() {
var server = http.createServer(this);
return server.listen.apply(server, arguments);
};
So, it's creating a DIFFERENT server object. You end up with two and the first one never gets started so when you give it to socket.io, it never works.
Instead, remove this:
const server = http.createServer(app);
And, use this instead:
const server = app.listen(PORT, function (err) { ...});
This way, your server variable will contain the one and only server object that is actually running.
Alternatively, you could remove the app.listen() and then just add this in it's place:
server.listen(PORT, ...);
The general idea is that you want this pair:
const server = http.createServer(app);
server.listen(PORT, ...);
Or, just this:
const server = app.listen(PORT, ...);
You cannot use both. Either way, that server object will represent the server that is actually running and will work with socket.io.
I been stuck on this for hours. I am able to run the code fine locally but when I try to deploy on heroku it throws a 404 error on my socket.
Server code
'use strict';
const express = require('express');
const socketIO = require('socket.io');
const path = require('path');
const PORT = process.env.PORT || 3000;
const server = express()
.use(express.static('public'))
.listen(PORT, () => console.log(`Listening on ${ PORT }`));
const io = socketIO(server);
io.on('connection', (socket) =>{
console.log("connection to socket", socket.id);
});
Client Code:
var socket = io();
socket.emit('email', {
fullName: fullName.value,
numOfGuest: numOfGuest.value,
guestName: guestName.value,
emailAddress: emailAddress.value,
guestStatus: status
});
Apps using Socket.io should enable session affinity.
heroku features:enable http-session-affinity
More about session affinity on heroku: https://devcenter.heroku.com/articles/session-affinity
The following works fine, I can get the http response on my client app BUT the socketio emit doesn't seem to work. I have no idea why it is not firing.
Here's my code (some parts removed):
app.js
var express = require('express');
var port = process.env.PORT || 3000;
var socketio = require('socket.io');
var app = express();
var server = require('http').Server(app);
var io = socketio(server);
var beacons = require('./routes/beacons')(io);
app.use('/beacons', beacons);
server.listen(port, () => {
console.log('Listening on port '+port);
});
io.on('connection', (socket) => {
socket.on('beacon:show', function(data) {
console.log('Show beacon: ' + data)
socket.broadcast.emit('beacon:draw', data)
})
});
module.exports = app;
beacons.js
var express = require('express');
var router = express.Router();
module.exports = function(io) {
router.get('/buy', function(req, res) {
io.emit('beacon:show', {data: someData}) // Not Firing
res.json({success: true})
})
return router
}
You need to wrap your io.emit() inside an io.on('connection', => {}).
At the moment, you are sending in just the io variable, but every single request and emission needs to be wrapped inside a connection event. Otherwise how does socket.io know who it's sending it to, or if there's even anyone to send it to?
This can only really be done inside beacons.js and the router.get('/buy') section, because having it the other way around (a route wrapped inside a connection) won't work.
I'm having trouble trying to figure out why I'm getting this 404 error. I've gone through all the other questions on this site that cover 'express-ws' and i've modeled my code exactly how the solutions prescribed yet the websocket won't make a connection. I'm trying to create a websocket connection between my express server and react app. Below are previews of my code:
Express using express-ws (server.js):
var express = require('express');
var expressWs = require('express-ws');
var bodyParser = require('body-parser');
var cors = require('cors');
var nodemailer = require('nodemailer');
var email = require('./credentials');
var port = process.env.PORT || 3001;
var path = require('path');
// const WebSocket = require('ws');
// const http = require('http');
expressWs = expressWs(express());
let app = expressWs.app;
var server = require('http').createServer(app);
app.use(cors());
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
if (process.env.NODE_ENV === 'production') {
app.use(express.static('app/build'));
}
app.get('/', function(req, res){
console.log('server running!');
res.end();
});
app.ws('/ws', function(ws, req) {
console.log( 'socket running!' );
});
server.listen(port);
console.log('server started on port ' + port);
The GET route works fine but the ws route doesn't.
Call to express from React app:
componentDidMount() {
let ws = new WebSocket('ws://localhost:3001/ws');
ws.on( 'open', function open() {
console.log('app connected to websocket!');
} );
ws.on( 'message', function ( message ) {
console.log( message );
})
}
I've looked at all the following questions and don't understand why their solutions don't work for me:
Socket.IO 404 Error
express-ws connection problem
Node not working with express-ws
If anyone can let me know what's going on that would be great.
It seems your code does not follow express-ws's document. To use express-ws and make WebSocket endpoint, the code would be as:
var express = require('express');
var app = express();
var expressWs = require('express-ws')(app);
...
app.ws('/', function(ws, req) {
ws.on('message', function(msg) {
console.log(msg);
});
console.log('socket running');
});
app.listen(3000);
In the client side, ws object does not have field on. To listen WebSocket connection and message, you can use onopen and onmessage:
ws.onopen = function() {
console.log('app connected to websocket!');
};
ws.onmessage = function(message) {
console.log( message );
};
I had this exact problem and for me the solution was to change:
server.listen(port);
to:
app.listen(port);
I suspect what is going on is that express-ws is using the app listen function as its cue to start upgrading connections to ws and this won't happen if the server listen port occurs instead.
I have an express node app, and I'm trying to keep my code neat by not having all the socket.io stuff in app.js
I don't know the best way to go about this. Here is my initial thought which doesn't feel like the cleanest one
// app.js
var express = require('express')
, app = express()
, server = require('http').createServer(app)
, url = require('url')
, somePage = require('./routes/somePage.js')
, path = require('path');
app.configure(function(){...});
app.get('/', somePage.index);
and the route
// somePage.js
exports.index = function (req, res, server) {
io = require('socket.io').listern(server)
res.render('index',{title: 'Chat Room'})
io.sockets.on('connection', function(socket) {
...code...
}
}
I feel like I'm close but not quite there
I don't know if I'm reading that right but it looks like you are starting a socket server on every request for /, which I'm frankly a little surprised works at all.
This is how I'm separating out the socket.io code from app.js (using express 3.x which is a bit different than 2.x):
// app.js
var express = require('express');
var app = express();
var server_port = config.get('SERVER_PORT');
server = http.createServer(app).listen(server_port, function () {
var addr = server.address();
console.log('Express server listening on http://' + addr.address + ':' + addr.port);
});
var sockets = require('./sockets');
sockets.socketServer(app, server);
// sockets.js
var socketio = require('socket.io');
exports.socketServer = function (app, server) {
var io = socketio.listen(server);
io.sockets.on('connection', function (socket) {
...
});
};
Hope that helps!
a similar approach is to pass app into index.js file and initiate http and socketio server there.
//app.js
//regular expressjs configuration stuff
require('./routes/index')(app); //all the app.get should go into index.js
Since app is passed into index.js file, we can do the app.get() routing stuff inside index.js, as well as connecting socketio
//index.js
module.exports = function(app){
var server = require('http').createServer(app)
,io = require('socket.io').listen(server);
app.get('/', function(req, res){
});
server.listen(app.get('port'), function(){
console.log("Express server listening on port " + app.get('port'));
});
io.sockets.on('connection', function(socket){
socket.on('my event', function(data){
console.log(data);
});
});
io.set('log level',1);
//io.sockets.emit(...)