# \`Socket.io-client\` doesn't work?

**URL:** <https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355>\
**Category:** Photoshop\
**Created:** [July 22, 2021, 5:25pm UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355 "2021-07-22T17:25:26Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![DavideBarranca](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/davidebarranca/32/1523_2.png) [@DavideBarranca](https://forums.creativeclouddeveloper.com/u/DavideBarranca)\
**Post date:** [July 22, 2021, 5:25pm UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/1 "2021-07-22T17:25:26Z")

</div>

Hi,  
I’ve set up a bare, local node.js/Socket.IO server, and a Photoshop UXP prototype plugin that loads `Socket.io-client` and _should_ connect with it.

I can’t make it work: the very same UXP/client code, copied verbatim into a React application connects flawlessly, hence I think that UXP has some incompatibility with [Socket.IO](http://Socket.IO). Although it doesn’t fire any error whatsoever (it even logs the `io` object and the `socket`).

Is this a known limitation?  
Thanks!

Davide

---

<div class="post-metadata">

**Author:** ![Erin\_Finnegan](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/erin_finnegan/32/100_2.png) [@Erin\_Finnegan](https://forums.creativeclouddeveloper.com/u/Erin_Finnegan)\
**Post date:** [July 22, 2021, 7:06pm UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/2 "2021-07-22T19:06:42Z")

</div>

By coincidence either @bootsie123 or @jake-pauls was just showing me some websocket thing this morning…

---

<div class="post-metadata">

**Author:** ![DavideBarranca](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/davidebarranca/32/1523_2.png) [@DavideBarranca](https://forums.creativeclouddeveloper.com/u/DavideBarranca)\
**Post date:** [July 22, 2021, 9:25pm UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/3 "2021-07-22T21:25:05Z")

</div>

Websockets are OK, it’s [Socket.IO](http://Socket.IO) that is problematic 🙂

---

<div class="post-metadata">

**Author:** ![jake-pauls](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/jake-pauls/32/1488_2.png) [@jake-pauls](https://forums.creativeclouddeveloper.com/u/jake-pauls)\
**Post date:** [July 22, 2021, 11:52pm UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/4 "2021-07-22T23:52:56Z")

</div>

Hi Davide!

Just want to clarify your implementation.

- How are you ‘requiring’ the `socket-io.client` package? Through a `<script>` tag? Or through an npm dependency?
- Are you running the [Socket.IO](http://Socket.IO) server that you’re trying to connect to locally?

I recently did create a sample plugin that uses [Socket.IO](http://Socket.IO) and it’s client library in order to manipulate websockets. The code for my `socket.io-client` implementation can be found [on my branch](https://github.com/MLH-Fellowship/uxp-photoshop-plugin-samples/blob/desktop-helper-sample/desktop-helper-sample/uxp/src/index.js).

The client side, as you’re also facing, was probably one of the trickier parts in implementing it that I found. If you’re running the socket server locally, you can grab the `socket.io-client` package from the server, however your code will throw errors if the server isn’t connected. In the end, I just used Webpack to bundle the npm dependency with my code so that it was always there.

That being said, I never had any abnormal behaviour with UXP/Socket.IO that wasn’t due to including the client package, so I’m curious as to what you’re facing.

Let me know! 😄

---

<div class="post-metadata">

**Author:** ![DavideBarranca](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/davidebarranca/32/1523_2.png) [@DavideBarranca](https://forums.creativeclouddeveloper.com/u/DavideBarranca)\
**Post date:** [July 23, 2021, 9:17am UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/5 "2021-07-23T09:17:34Z")

</div>

Hi @jake-pauls!  
Mine is a React project (bundled with Webpack), which sourcecode is as follows:

```js
import { useEffect, useState } from "react";
const io = require('socket.io-client');
const socket = io('http://localhost:3000');

console.log({io}); // logs it fine
console.log({socket}); // logs it fine too

const App = () => {

  const [isConnected, setIsConnected] = useState(socket.connected);
  const [lastMessage, setLastMessage] = useState(null);

  useEffect(() => {
    try {
      socket.on('connect', () => {
        setIsConnected(true);
        console.log(socket.id)
        socket.emit("hello")
      });
      socket.on('disconnect', () => {
        setIsConnected(false);
      });
      socket.on('message', data => {
        setLastMessage(data);
      });
      return () => {
        socket.off('connect');
        socket.off('disconnect');
        socket.off('message');
      };
    } catch(e) { console.error(e) }
  })

  const sendMessage = () => {
    socket.emit('hello!');
  }

  return (<>
    <sp-heading size="s">Socket.IO</sp-heading>
    <sp-body>Connected: {'' + isConnected}</sp-body>
    <sp-body>Last message: {lastMessage || '-'}</sp-body>
    <sp-button onClick={sendMessage}>Say hello!</sp-button>
  </>)
}
export default App

```

The server couldn’t be simpler:

```js
const io = require('socket.io')(3000, {
  cors: {
    origin: "*",
    methods: ['GET', 'PUT', 'POST']
  }
});

io.on('connection', socket => {
  console.log(`connect: ${socket.id}`);

  socket.on('hello!', () => {
    console.log(`hello from ${socket.id}`);
  });

  socket.on('disconnect', () => {
    console.log(`disconnect: ${socket.id}`);
  });
});

setInterval(() => {
  io.emit('message', new Date().toISOString());
}, 1000);

```

Same code in a React app, as expected:

 ![image](https://us1.discourse-cdn.com/flex015/uploads/xdplugins/original/2X/2/294ffe18a4c213d3fc0e2b10b55bbd2c6328b2f9.png)

My sad panel instead…

 ![image](https://us1.discourse-cdn.com/flex015/uploads/xdplugins/original/2X/7/779d6128384f8314c447d11f2a308a2d31248d12.png)

It seems to get both `io` and the `socket` correctly, but doesn’t seem willing to connect, I can’t really figure out why…  
Do you see anything wrong? Thanks!

Davide

EDIT: I’ve tried both on PS-release and PS-prerelease (with manifest v4 and v5), no luck.

---

<div class="post-metadata">

**Author:** ![keer4n](https://avatars.discourse-cdn.com/v4/letter/k/90db22/32.png) [@keer4n](https://forums.creativeclouddeveloper.com/u/keer4n)\
**Post date:** [July 23, 2021, 3:09pm UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/6 "2021-07-23T15:09:51Z")

</div>

Hi @jake-pauls,

It’s the same for me. I tried running your Plugin/Desktop Helper Sample which fails to connect. Ended up using websocket for now, but socket io would be better.

---

<div class="post-metadata">

**Author:** ![jake-pauls](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/jake-pauls/32/1488_2.png) [@jake-pauls](https://forums.creativeclouddeveloper.com/u/jake-pauls)\
**Post date:** [July 23, 2021, 4:22pm UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/7 "2021-07-23T16:22:17Z")

</div>

Thanks for this @DavideBarranca. I’ll take a look into this today.

Also, thanks for pulling the sample @keer4n. This is the second time that’s happened so I’m going to spend some time and figure out what’s going on. I totally understand the preference for [Socket.IO](http://Socket.IO), which was a main reason why I built the sample!

---

<div class="post-metadata">

**Author:** ![jake-pauls](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/jake-pauls/32/1488_2.png) [@jake-pauls](https://forums.creativeclouddeveloper.com/u/jake-pauls)\
**Post date:** [July 23, 2021, 9:47pm UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/8 "2021-07-23T21:47:18Z")

</div>

Hi everyone,

I recreated a UXP plugin with @DavideBarranca’s React/Socket code and here was my result

 ![socket-cap-2](https://us1.discourse-cdn.com/flex015/uploads/xdplugins/original/2X/f/fcd234b5a5491aa355eacdbe1a464c3b15570212.png)

Whether its good news or bad news 😅 the bug wasn’t replicated on my machine. Regarding the Desktop Helper Sample, I also did a clean pull, install, and demo of that and it ran fine. After, I jumped in a call with @bootsie123 and he also was able to install and run both plugins successfully.

* * *

@DavideBarranca is there anyway you could run the [Socket.IO](http://Socket.IO) server with a debug flag? For instance:

```auto
DEBUG=socket* node src/index.js # Or whichever file/method you're running the server from

```

On my machine it clearly connects and pings the related timestamps every second. I’d be curious to see what the output on your end is doing. 🤔

* * *

As for @keer4n, are you using a Mac? Although I suspect that’s the case, if you do happen to be using Windows, I’d recommend checking out the [quick video](https://www.youtube.com/watch?v=0L8yM3ZU7Ps) I made, to really quickly ensure that all the build/setup steps are ok! If it’s still not working on Windows then I can keep diving into it.

* * *

However, @bootsie123 and I are thinking this could be a platform issue of some kind, since we were both running Windows 10 and I know both @DavideBarranca and @kerrishotts (who had troubles running the helper sample) are running Mac.

I feel like it’s either a platform specific issue with [Socket.IO](http://Socket.IO) (which is weird considering it obviously works in a browser on Mac) or its specifically UXP/Mac that is having issues with [Socket.IO](http://Socket.IO).

Definitely going to try and spin this up on a Mac soon, but I thought I’d drop an update.

---

<div class="post-metadata">

**Author:** ![DavideBarranca](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/davidebarranca/32/1523_2.png) [@DavideBarranca](https://forums.creativeclouddeveloper.com/u/DavideBarranca)\
**Post date:** [July 24, 2021, 8:23am UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/9 "2021-07-24T08:23:59Z")

</div>

Still no joy…! Arrgh! 🙂

 ![image](https://us1.discourse-cdn.com/flex015/uploads/xdplugins/original/2X/2/234a82cc0bffd2d0bd64897da51b1e349bdb4234.jpeg)

@jake-pauls would you be so kind to zip both the exact uxp plugin and server code you’re using and put it somewhere e.g. GDrive? That’s a mystery! I’ve tried also changing ports, checking the UXP Dev Tool Service port (just in case) but it still doesn’t want to connect, I’m really puzzled…  
BTW, is @kerrishotts still unable to run it on Mac?  
Thanks for your time, much appreciated Jake!

Davide

---

<div class="post-metadata">

**Author:** ![DavideBarranca](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/davidebarranca/32/1523_2.png) [@DavideBarranca](https://forums.creativeclouddeveloper.com/u/DavideBarranca)\
**Post date:** [July 24, 2021, 9:50am UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/10 "2021-07-24T09:50:20Z")

</div>

**SOLVED!** 🍷

The trick (at least for me) was to add an explicit `transports` prop in the options, **both** on the client and the server.

 ![image](https://us1.discourse-cdn.com/flex015/uploads/xdplugins/original/2X/4/42e3b30540a61c1c4440b805d0798af6c47538ea.png)

Phew!

---

<div class="post-metadata">

**Author:** ![keer4n](https://avatars.discourse-cdn.com/v4/letter/k/90db22/32.png) [@keer4n](https://forums.creativeclouddeveloper.com/u/keer4n)\
**Post date:** [July 26, 2021, 5:27pm UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/11 "2021-07-26T17:27:48Z")

</div>

Yes, I’m on mac @jake-pauls, @DavideBarranca solution works for me too. Thanks.

---

<div class="post-metadata">

**Author:** ![kerrishotts](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/kerrishotts/32/8_2.png) [@kerrishotts](https://forums.creativeclouddeveloper.com/u/kerrishotts)\
**Post date:** [July 26, 2021, 6:31pm UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/12 "2021-07-26T18:31:35Z")

</div>

WOW! Glad you were able to solve this (apologies for being silent here; had other things to attend to).

I wonder what `transports` is causing `socket.io` to do – I wonder if there’s some various discovery mechanisms that are failing on macOS… Glad this works, though – that’s easy enough to doc.

---

<div class="post-metadata">

**Author:** ![DavideBarranca](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/davidebarranca/32/1523_2.png) [@DavideBarranca](https://forums.creativeclouddeveloper.com/u/DavideBarranca)\
**Post date:** [July 27, 2021, 2:32pm UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/13 "2021-07-27T14:32:25Z")

</div>

Actually I read that on a few StackOverflow posts, but I was always looking at the Server side code, when I added it on the Client too, confetti fell from the sky 🎉  
At the moment I’m using `["websocket", "polling"]` — no idea whether adding the latter makes it any better, but it’s free so why not 😊

---

<div class="post-metadata">

**Author:** ![bootsie123](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/bootsie123/32/1489_2.png) [@bootsie123](https://forums.creativeclouddeveloper.com/u/bootsie123)\
**Post date:** [July 28, 2021, 3:33pm UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/14 "2021-07-28T15:33:32Z")

</div>

Glad you got it to work in the end! I finally got a chance to run everything on macOS and it seems like it’s an issue in the way [Socket.IO](http://Socket.IO) setups up its default transports.

By default `io` initializes with `["polling", "websocket"]` as its transports. This means that it will start out with making HTTP requests through polling and then upgrade the connection to websockets if possible.

It seems for some reason on macOS polling results in an HTTP error on the client. I haven’t looked too much into it yet to see where the exact problem lies, but essentially this means that it can’t connect to the server to then establish a websocket connection. However, by setting the transports to `["websocket"]`, you essentially force [Socket.IO](http://Socket.IO) into only connecting through websockets which bypasses the need for polling.

Looking into this further, it seems it might be an issue with the way [Socket.IO](http://Socket.IO) sends requests and how UXP handles them. Monitoring `localhost` with Wireshark reveals that the request itself is failing before it even gets sent. This is particularly weird considering that the URLs are all reachable. Might be something for one of the developers to take a look at in their free time

---

<div class="post-metadata">

**Author:** ![bootsie123](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/bootsie123/32/1489_2.png) [@bootsie123](https://forums.creativeclouddeveloper.com/u/bootsie123)\
**Post date:** [July 29, 2021, 4:00pm UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/15 "2021-07-29T16:00:31Z")

</div>

Small update from my previous reply:

After talking with @kerrishotts it looks like it’s part of the security in macOS which causes HTTP requests to localhost to be blocked (which causes polling to error out). If you change the URL from `localhost:3000` to `127.0.0.1:3000` everything seems to work fine. Hope this helps!

---

<div class="post-metadata">

**Author:** ![DavideBarranca](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/davidebarranca/32/1523_2.png) [@DavideBarranca](https://forums.creativeclouddeveloper.com/u/DavideBarranca)\
**Post date:** [July 30, 2021, 9:06am UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/16 "2021-07-30T09:06:33Z")

</div>

You’re correct! I would swear that I tried `127.0.0.1` before writing this, but to the best of my recollections I was using `127.0.0.0`, silly me… 😅  
Thanks again,

Davide

---

<div class="post-metadata">

**Author:** ![BillCipher](https://avatars.discourse-cdn.com/v4/letter/b/34f0e0/32.png) [@BillCipher](https://forums.creativeclouddeveloper.com/u/BillCipher)\
**Post date:** [August 7, 2023, 9:57am UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/17 "2023-08-07T09:57:00Z")

</div>

@DavideBarranca do you remember what [socket.io](http://socket.io) version you were using? Im kinda in the same situation but your solution didn’t work for me.

---

<div class="post-metadata">

**Author:** ![dongdt\_pxz](https://avatars.discourse-cdn.com/v4/letter/d/858c86/32.png) [@dongdt\_pxz](https://forums.creativeclouddeveloper.com/u/dongdt_pxz)\
**Post date:** [May 24, 2024, 7:16am UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/18 "2024-05-24T07:16:42Z")

</div>

I tried this but it doesn’t work. My [Socket.IO](http://Socket.IO) server and client is 4.7.5

---

<div class="post-metadata">

**Author:** ![Jarda](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/jarda/32/1909_2.png) [@Jarda](https://forums.creativeclouddeveloper.com/u/Jarda)\
**Post date:** [May 24, 2024, 7:45am UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/19 "2024-05-24T07:45:03Z")

</div>

On Windows I reported error with ping/pong messages… if message is empty string it never sends. On MacOS this works. Not sure what [Socket.IO](http://Socket.IO) sends.

Second issue I reported is missing WebSocket class is missing static constants for socket status. Those are present only on instance of class but not class itself as static properties. So I had to add them to fix it.

Maybe there is more… also check the manifest permissions.

---

<div class="post-metadata">

**Author:** ![Jarda](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/jarda/32/1909_2.png) [@Jarda](https://forums.creativeclouddeveloper.com/u/Jarda)\
**Post date:** [May 24, 2024, 7:47am UTC](https://forums.creativeclouddeveloper.com/t/socket-io-client-doesnt-work/3355/20 "2024-05-24T07:47:27Z")

</div>

Also if you have plugin installed and you load it additionally in UDT you can have same plugin loaded twice but in UI you see only one of them. Therefore instead of one client you can have two clients and they can fight over the connection if you need 1:1 relation 😃