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
<!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 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)
1880 work, but 3000 return ...
while I set script is <script src="http://localhost:1880/uibuilder/uibuilder.iife.min.js"></script>.
I already set proxy too but not work...
@TotallyInformation please help me sir, my boss is angry
1 Like
I am using new version both nodered and uibuilder, uibuilderfe.js no longer work, so I cannot follow WIKI 
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 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 connections, you must do this on the script line that loads the client library. It should look like this:
<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)..
A couple of reality checks here please.
- You are getting this very powerful tool completely free of charge. You can hardly expect rapid support.
- When creating something complex for a demanding boss/customer, it is customary to create a test system, not break a live system.
