NodeRed not loading up when adding modules to the flow

I'm working on a project using NodeRed deployed with docker, I am using nginx location block to navigate to the particular container like http://localhost/project/projectId/port/? when I trigger this url first time it is showing up the node red flow but when I add modules from the Manage pallet and hit the same url http://localhost/project/projectId/port/? is not opening the flow and it is getting stuck at loading, what is the thing happening when adding modules to not adding modules and how to resolve this issue is any thing we can do it from nginx location block?

Before adding modules

enter image description here

After adding modules

Nodered is getting stuck

I suspect that websockets are getting blocked somewhere. Perhaps you have to do something in nginx to allow websockets. To confirm that is the problem look in the browser developer console to see if there is an error.

I can see in the logs Failed to load resource: the server responded with a status of 400 (Bad Request)

What resource? Refresh the page after opening the tools.

Did you look up the nginx docs to see what you need to do to allow websocket connections?

I have written these

proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";

for websocket but not change Colin

So what are you now seeing in the developer tools when you refresh the page?

Failed to load resource: the server responded with a status of 400 (Bad Request)

http://localhost/project/projectId/port/nodes/messages?lng=en-GB&_=1670325432158

Loading Node catalogs screen stuck there

I have never seen the editor look for a url anything like that.
Can you post a screenshot of that in the developer console, with the messages around it as well?

Sure

Some plugins and nodes load a message catalog (for internationalisation) from the endpoint messages

So how to resolve it Steve

Fix up your nginx setup to NOT block access to this resource.

I assume this all works if you do NOT use nginx and simply access the URL locally?

So how to make nginx to not block the resource i am using regex nginx location block, yes this may work fine without nginx

   location ~ "/project/projectid/([0-9]+)/(.*)" {
            set $port $3;
            set $token $4;
            rewrite ^/project/projectid/[0-9]+(.*) $1 break;
            proxy_pass http://127.0.0.1:$port/$token;
            proxy_set_header Host $host;
            add_header Access-Control-Allow-Methods *;
            proxy_set_header Connection upgrade;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
    }

If havent found the solution can any one, it is getting stuck when adding modules to the flow before adding modules from Manage it is working fine

the issue i found is with the nginx location block not with the node red any solution @Colin @Steve-Mcl

I can also see

expected_error", message: "Cannot read properties of undefined (reading 'indexOf')"

Where are you seeing that? What is the text around that message?

  1. {code: "unexpected_error", message: "Cannot read properties of undefined (reading 'indexOf')"}

  2. code: "unexpected_error"

  3. message: "Cannot read properties of undefined (reading 'indexOf')"

In Network --> Preview

Where is Network -> Preview? Is this in node-red or somewhere else?

This is from browser Network--> preview, in browser network i am seeing this error for

nodes/messages?lng=en-GB&_=1670414803827

Is there any thing should i add to the nginx location block

I don't see what that error has got to do with the message in the browser.

As for the nginx issue, I don't know about nginx so can't help with that.