javascript - socket.io - hundreds of requests instead of one connection

I created simple app to start with socket.io, but when I run it, Chrome(tested in other browsers, result same) eats all of my CPU and makes many requests:

I'm new to sockets, but I'm sure this is not how it should work. The code running in browser is really simple, it should just connect to socket and log all received data to console:

index.html

<!DOCTYPE html>
<html>
<head>
    <script src=".io-1.2.0.js" charset="UTF-8"></script>
</head>
<body>
<script type="application/javascript">
    var Sockets = io.connect('http://localhost:4000');
    Sockets.on('Test', function (data) {
        console.log(data);
    });
</script>

</body>
</html>

Also, my server file looks like this:

server.js

var app = require('express')();
var http = require('http').Server(app);
var bodyParser = require("body-parser");
var io = require('socket.io')(http);
var port = 4000;

http.listen(port, function () {
    console.log('Server running at port ' + port);
});

var urlencodedParser = bodyParser.urlencoded({extended: false});
app.post('/', urlencodedParser, function (req, res) {
    if (!req.body) return res.sendStatus(400);
    var post = req.body;
    io.emit("Test", post.data);
    console.log(post.data);
    res.send('true');
});

io.on('connection', function(socket){
    console.log('a user connected');
    socket.on('disconnect', function(){
        console.log('user disconnected');
    });
});

When I run the server node server.js, I got the Server running at port 4000 message and everything seems fine. But when I open the index.html in my browser, the node console is spammed by a user connected messages. Instead of connecting one client, the browser makes dozens of requests every second. When I close the browser, there is no output for some time, and then the node console is spammed by user disconnected messages.

This server should redirect all data sent via POST to connected sockets. When I make this POST request, the node server receives it (I know because it print's it into node console). But it's not received by the socket client, as there is no output in browser console (but the browser still makes dozens of new connections every second.

What is wrong here? First I thought I just messed up, so I went back and copy-pasted code from tutorial I found (not in English, but in Czech), but nothing changed. The tutorial has a lot of positive feedback, so there is propably something wrong with my puter. But what?

I created simple app to start with socket.io, but when I run it, Chrome(tested in other browsers, result same) eats all of my CPU and makes many requests:

I'm new to sockets, but I'm sure this is not how it should work. The code running in browser is really simple, it should just connect to socket and log all received data to console:

index.html

<!DOCTYPE html>
<html>
<head>
    <script src="https://cdn.socket.io/socket.io-1.2.0.js" charset="UTF-8"></script>
</head>
<body>
<script type="application/javascript">
    var Sockets = io.connect('http://localhost:4000');
    Sockets.on('Test', function (data) {
        console.log(data);
    });
</script>

</body>
</html>

Also, my server file looks like this:

server.js

var app = require('express')();
var http = require('http').Server(app);
var bodyParser = require("body-parser");
var io = require('socket.io')(http);
var port = 4000;

http.listen(port, function () {
    console.log('Server running at port ' + port);
});

var urlencodedParser = bodyParser.urlencoded({extended: false});
app.post('/', urlencodedParser, function (req, res) {
    if (!req.body) return res.sendStatus(400);
    var post = req.body;
    io.emit("Test", post.data);
    console.log(post.data);
    res.send('true');
});

io.on('connection', function(socket){
    console.log('a user connected');
    socket.on('disconnect', function(){
        console.log('user disconnected');
    });
});

Share Improve this question asked Nov 14, 2017 at 23:27 Adam Ježek 4831 gold badge6 silver badges18 bronze badges

When you say "open the index.html in my browser", what exactly does that mean? Are you opening it directly from the file system? You should be opening it via the web server, not via the file system. Because of the way socket.io connects, it will not work properly to a cross-origin server without CORS configuration on the web server. http://locahost:4000 will be a cross origin endpoint if you are opening index.html from the file system and will not let you connect properly. – jfriend00 Commented Nov 14, 2017 at 23:34
@jfriend00 I'm using "Run" button in PhpStorm. As you can see in the screenshot, the url is localhost:phpstorm'sport/somepath/index.html – Adam Ježek Commented Nov 14, 2017 at 23:39
What does the Run button actually do? I ask again. Is index.html being loaded from the file system or from your web server? It needs to be loaded from your web server. FYI, your web server code does not show any way that it is serving index.html so I suspect you are loading it from the file system and that would be wrong and the cause of the problem. – jfriend00 Commented Nov 14, 2017 at 23:39
@jfriend00 The "Run" button in PhpStorm starts internal webserver in PhpStorm. I can access the page from other puters in my LAN by entering my puter IP with port figured in PhpStorm, so there must be a webserver. – Adam Ježek Commented Nov 14, 2017 at 23:49

Add a ment |

3 Answers 3

Sorted by: Reset to default 4

I had experienced the same issue, by following an example where the client was using the source of socket.io from this cdn: https://cdn.socket.io/socket.io-1.2.0.js

Tons of clients created whenever I tried to run the file (no matter if i just double clicked the html file, or if I put it under a web server, like IIS) . I then realized it might be an older version, and I just took the latest one released from this source: https://cdnjs.cloudflare./ajax/libs/socket.io/2.0.4/socket.io.js

Everything works fine now. Hope this helps

So to find what exactly was wrong, I downloaded example socket chat from socket.io website. When I runned it, I experienced exactly the same wrong behaviour - browser is opening many socket connections every second instead of keeping one.

So I deleted node_modules folder and used npm to install these modules again and whoa, it worked. So propably the files just corrupted during download or whatever it was, but doing the same procedure again was working this time.

Your configuration of running that page from a different web server than your socket.io server is on won't work as you have it. It will take one of three changes to make it work:

You can use the "same origin" for the web page and the socket.io connection by loading the web page from the same server that your socket.io. That means you need to load the web page directly from your socket.io web server.
You can configure your socket.io web server to accept cross origin connections (CORS connections).
You can configure your socket.io client to connect directly using webSocket without doing socket.io's usual preview with a regular http request.

If you're testing something you intend to deploy for real, you may as well just make your existing socket.io web server server your web page and load the web page directly from that.

Another possible cause of a situation like this is an inpatible client and server version of socket.io. You should make absolutely sure that you have the same version of socket.io on client and server. If you get the client socket.io library from /socket.io/socket.io.js from your socket.io web server, the the client version will automatically always match the server version. The way you are loading it from a CDN, you have to manually make sure you have identical versions.

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

javascript - socket.io - hundreds of requests instead of one connection - Stack Overflow

3 Answers 3

与本文相关的文章

评论列表(0)