# How to connect socket ReactJS (build in uibuilder) and NodeRED

**URL:** <https://discourse.nodered.org/t/how-to-connect-socket-reactjs-build-in-uibuilder-and-nodered/99477>\
**Category:** General\
**Tags:** uibuilder\
**Created:** [22 October 2025 09:25 UTC](https://discourse.nodered.org/t/how-to-connect-socket-reactjs-build-in-uibuilder-and-nodered/99477 "2025-10-22T09:25:58Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![quocthai](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/quocthai/32/103967_2.png) [@quocthai](https://discourse.nodered.org/u/quocthai)\
**Post date:** [22 October 2025 09:25 UTC](https://discourse.nodered.org/t/how-to-connect-socket-reactjs-build-in-uibuilder-and-nodered/99477/1 "2025-10-22T09:25:58Z")

</div>

Hello everyone, I am newbie at NodeRED, also my English was bad so if you dont understand what I say below, please let me know  
I face issue that when I build frontend ReactJS (in uibuilder, already set uibuilder serve /build folder) and backend NodeRED, but I cannot config connect socket. I know that uibuilder has uibuilder.iife.js which help simplify connect socket, no need to config manual  
My react run at port 3000 /project, I have already config Catch SPA (because uibuild base on nodered, same port), when access /project/\* end with file, it will read file .html .js .css...etc any static file , but still not work.  
Problem occurs in dev mode when I run my react (npm start). After build successfully, it work good in uibuilder localhost:1880/project  
Here is all details, please help me, thanks and love you all  
public/index.html

```auto
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <script src="http://localhost:1880/uibuilder/uibuilder.iife.min.js"></script>
    <title>React App</title>
  </head>
  <body>
    <div id="root"></div>
    <!-- Load uibuilder client (includes Socket.IO) -->
   
  </body>
</html>

```

[http://localhost:1880/uibuilder/uibuilder.iife.min.js](http://localhost:1880/uibuilder/uibuilder.iife.min.js) works  
when access devtool at react dev mode 3000, i see error that it call ([http://localhost:3000/uibuilder/vendor/socket.io/?EIO=4&transport=polling&t=s39g92b8](http://localhost:3000/uibuilder/vendor/socket.io/?EIO=4&transport=polling&t=s39g92b8))  
1880 work, but 3000 return ...

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/9/7/972c1f300f2fb09fb723ddd4bd758ec99f828d07.png)

while I set script is `<script src="http://localhost:1880/uibuilder/uibuilder.iife.min.js"></script>.`  
I already set proxy too but not work...

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/d/3/d3afb5aa13cffcfe114031cc017fcd79e19d31ed.png)

---

<div class="post-metadata">

**Author:** ![quocthai](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/quocthai/32/103967_2.png) [@quocthai](https://discourse.nodered.org/u/quocthai)\
**Post date:** [22 October 2025 09:37 UTC](https://discourse.nodered.org/t/how-to-connect-socket-reactjs-build-in-uibuilder-and-nodered/99477/2 "2025-10-22T09:37:49Z")

</div>

@TotallyInformation please help me sir, my boss is angry

---

<div class="post-metadata">

**Author:** ![quocthai](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/quocthai/32/103967_2.png) [@quocthai](https://discourse.nodered.org/u/quocthai)\
**Post date:** [22 October 2025 09:38 UTC](https://discourse.nodered.org/t/how-to-connect-socket-reactjs-build-in-uibuilder-and-nodered/99477/3 "2025-10-22T09:38:52Z")

</div>

I am using new version both nodered and uibuilder, uibuilderfe.js no longer work, so I cannot follow WIKI ☹

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [25 October 2025 19:24 UTC](https://discourse.nodered.org/t/how-to-connect-socket-reactjs-build-in-uibuilder-and-nodered/99477/4 "2025-10-25T19:24:53Z")

</div>

Sorry, I've had 2 eye operations over the last few weeks - both eyes - today is the first time in just over a week since my last op that I can see anything at all on a screen.

Looking at your screenshots, clear that the client cannot connect to the [socket.io](http://socket.io) server.

The first issue to look at is your mix of URL's. In all of my examples and default templates, I am very careful to use a specific style to avoid relative and absolute reference issues.

Every URL either starts with `../uibuilder` for all "central" resources such as the client library and `./` for every instance resource (`./` starts at the actual web page - normally index.html and so should point to your `build` folder).

This is the first thing you should go through and rationalise. Then check to make sure that all resources are loading (no 404 errors).

The next most common issue would be a configuration issue with your proxy server. You need to ensure that it is proxying websockets correctly (though actually, if it isn't, that will not cause the client to fail to connect since it will fall back to long poling anyway). Also make sure that you proxy all of the possible endpoints correctly because UIBUILDER has many, though they all come under the 2 paths I've already shown). If you can, do a test without the proxy.

Next up, you can make a small adjustment to your index.html to force the uibuilder client library to be more vocal about what it does. To be able to see what is happening with the [socket.io](http://socket.io) connections, you must do this on the script line that loads the client library. It should look like this:

```html
<script defer src="../uibuilder/uibuilder.iife.min.js" logLevel="5"></script>

```

(Note the use of the `defer` keyword - you are not using that in your own HTML so you may need to remove it - we can have a separate discussion about why you should use if once we have everything working)..

> [@quocthai](#):
>
> @TotallyInformation please help me sir, my boss is angry

A couple of reality checks here please.

1. You are getting this very powerful tool completely free of charge. You can hardly expect rapid support.
2. When creating something complex for a demanding boss/customer, it is customary to create a test system, not break a live system.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [23 January 2026 19:25 UTC](https://discourse.nodered.org/t/how-to-connect-socket-reactjs-build-in-uibuilder-and-nodered/99477/5 "2026-01-23T19:25:30Z")

</div>

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.
