# Socket.io implementation problems

**URL:** <https://phaser.discourse.group/t/socket-io-implementation-problems/11460>\
**Category:** Phaser 3\
**Created:** [March 29, 2022, 12:17pm UTC](https://phaser.discourse.group/t/socket-io-implementation-problems/11460 "2022-03-29T12:17:53Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![ResetRich](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/resetrich/32/6302_2.png) [@ResetRich](https://phaser.discourse.group/u/ResetRich)\
**Post date:** [March 29, 2022, 12:17pm UTC](https://phaser.discourse.group/t/socket-io-implementation-problems/11460/1 "2022-03-29T12:17:53Z")

</div>

Hi all - this is my first live Phaser project, which has so far progressed fairly well. It is a fairly simple turn-based battle game, and you can view a current build here: [Bulldroids](https://www.resetgames.co.uk/files/bulldroids/dist/)

Much of the game is implemented now, but it has reached the point where I need to implement multiplayer, which is another first for me.

This tutorial seemed the best for what I need ([Create a Basic Multiplayer Game in Phaser 3 with Socket.io – Part 1 – GameDev Academy](https://gamedevacademy.org/create-a-basic-multiplayer-game-in-phaser-3-with-socket-io-part-1/?a=13)), and from what I have seen on the forums, it is a popular tutorial.

I have got to the point of adding the server code, then installing [socket.io](http://socket.io) as per the tutorial. However, I get the following error that I can’t fathom how to fix:

"Property ‘listen’ does not exist on type ‘typeof import(“C:/xampp/htdocs/node\_modules/socket.io/dist/index”)’.

Referencing this server code:

```javascript
var express = require('express')
var app = express()

// @ts-ignore
var server = require('http').Server(app)

var io = require('socket.io').listen(server)

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

app.use(express.static(__dirname + '/public'))

app.get('/', function (req, res) {
  res.sendFile(__dirname + '/index.html')
})

server.listen(8081, function () {
  console.log(`Listening on ${server.address().port}`)
})

```

This is the offending line: “var io = require(‘[socket.io](http://socket.io)’).listen(server)”

The second error I get, related to the first, is in the Create function of my first scene:

“Cannot find name ‘io’.”

From this line:  
this.socket = io()

All I have done so far is followed the example code in the tutorial. I have also included my index file code below.

In terms of what the game needs to do, it is fairly simple - per round there are only two options each player can select - their move, and their special Pawer move. So the server-side stuff needs to be fairly minimal.

Index code:

```javascript
<html>
    <head>
        <title>Bulldroids</title>
    </head>
    <body>
        <script src="/socket.io/socket.io.js"></script>
        
        <div id='bulldroidsgame'>
        
            <script src="//cdn.jsdelivr.net/npm/phaser@3.55.2/dist/phaser.min.js"></script>
            <script type="module" src="src/Bulldroids.js"></script>
        </div>
    </body>
</html>

```

---

<div class="post-metadata">

**Author:** ![Puccini](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/puccini/32/4984_2.png) [@Puccini](https://phaser.discourse.group/u/Puccini)\
**Post date:** [March 29, 2022, 2:09pm UTC](https://phaser.discourse.group/t/socket-io-implementation-problems/11460/2 "2022-03-29T14:09:48Z")

</div>

as far as i can see from socket-io-website (and use in my project) u dont have to use “listen”, but to instantiate the socket-server via:

```javascript
require('socket.io')(server)

```

the “listen” is for the server, not the “io” 🙂

see also:

> **[Get started | Socket.IO](https://socket.io/get-started/chat)**
>
> In this guide we’ll create a basic chat application. It requires almost no basic prior knowledge of Node.JS or Socket.IO, so it’s ideal for users of all knowledge levels.

---

<div class="post-metadata">

**Author:** ![ResetRich](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/resetrich/32/6302_2.png) [@ResetRich](https://phaser.discourse.group/u/ResetRich)\
**Post date:** [March 29, 2022, 4:08pm UTC](https://phaser.discourse.group/t/socket-io-implementation-problems/11460/3 "2022-03-29T16:08:40Z")

</div>

Thanks [Puccini](https://phaser.discourse.group/u/Puccini). I’ll give that a try.

---

<div class="post-metadata">

**Author:** ![ResetRich](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/resetrich/32/6302_2.png) [@ResetRich](https://phaser.discourse.group/u/ResetRich)\
**Post date:** [March 29, 2022, 5:34pm UTC](https://phaser.discourse.group/t/socket-io-implementation-problems/11460/4 "2022-03-29T17:34:07Z")

</div>

> [@Puccini](#):
>
> `require('socket.io')(server)`

Looks like it was out of date tutorial code. I followed the Get Started stuff on [Socket.io](http://Socket.io) and it works now. Thanks Puccini, that really helped 🙂

---

<div class="post-metadata">

**Author:** ![ResetRich](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/resetrich/32/6302_2.png) [@ResetRich](https://phaser.discourse.group/u/ResetRich)\
**Post date:** [March 29, 2022, 6:01pm UTC](https://phaser.discourse.group/t/socket-io-implementation-problems/11460/5 "2022-03-29T18:01:16Z")

</div>

I have one last issue - my scripts can’t find io:

Cannot find name ‘io’.

That is the error from this code in my first scene:

```javascript
    create()
    {
        var self = this
        this.socket = io()
        this.socket.on('currentPlayers', function (players) {
            Object.keys(players).forEach(function (id) {
                if (players[id].playerId === self.socket.id) {
                    addPlayer(self, players[id])
                }
            })
        })
}

```

I added the call code into Index as advised:

```javascript
<body>        
        <div id='bulldroidsgame'>
        
            <script src="//cdn.jsdelivr.net/npm/phaser@3.55.2/dist/phaser.min.js"></script>
            <script type="module" src="src/Bulldroids.js"></script>
        </div>

        <script src="/socket.io/socket.io.js"></script>
        <script>
            var socket = io()
        </script>
    </body>

```

Little unsure how I get my phaser scripts to find io?

---

<div class="post-metadata">

**Author:** ![jhice](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/jhice/32/6391_2.png) [@jhice](https://phaser.discourse.group/u/jhice)\
**Post date:** [March 29, 2022, 7:19pm UTC](https://phaser.discourse.group/t/socket-io-implementation-problems/11460/6 "2022-03-29T19:19:03Z")

</div>

Hi @ResetRich

Perhaps you should try loading the [socket.io](http://socket.io) script before your own script (in your HTML code). So that it is known by your script when calling io().

If it works, and even not, you dont need the last code `var socket = io()` here.

---

<div class="post-metadata">

**Author:** ![ResetRich](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/resetrich/32/6302_2.png) [@ResetRich](https://phaser.discourse.group/u/ResetRich)\
**Post date:** [March 29, 2022, 7:54pm UTC](https://phaser.discourse.group/t/socket-io-implementation-problems/11460/7 "2022-03-29T19:54:43Z")

</div>

Thanks @jhice - looks like it is just a typescript error, the actual code works fine. Now tested by emitting a message with socket.

So, I have gone with the “// @ts-ignore” option.

---

<div class="post-metadata">

**Author:** ![jhice](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/jhice/32/6391_2.png) [@jhice](https://phaser.discourse.group/u/jhice)\
**Post date:** [March 29, 2022, 9:00pm UTC](https://phaser.discourse.group/t/socket-io-implementation-problems/11460/8 "2022-03-29T21:00:50Z")

</div>

Great 🙂 I made a multiplayer game with Phaser and [socket.io](http://socket.io) a few years ago and had fun doing it, so I wish you the best with your game.

---

<div class="post-metadata">

**Author:** ![ResetRich](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/resetrich/32/6302_2.png) [@ResetRich](https://phaser.discourse.group/u/ResetRich)\
**Post date:** [March 30, 2022, 12:10pm UTC](https://phaser.discourse.group/t/socket-io-implementation-problems/11460/9 "2022-03-30T12:10:04Z")

</div>

Cheers 🙂 I’m starting to get there now with the MP stuff. Phew!
