Lost UI navigator bar at Screen create workflow

I’m running a self-hosted n8n instance behind nginx (Docker setup). The navigation bar and some UI tabs (like Overview, Editor, Executions) are missing from the web interface. I expect to see the full navigation bar as shown in the official documentation/UI screenshots.

  • There is no visible error message on the UI, but when I check the browser Developer Tools, I see a 500 error for the endpoint: /rest/credentials/for-workflow?projectId=
{ "message": \[ { "code": "invalid_union", "unionErrors": \[ { "issues": \[ { "code": "invalid_type", "expected": "string", "received": "undefined", "path": \["workflowId"\], "message": "Required" } \], "name": "ZodError" }, { "issues": \[ { "code": "invalid_type", "expected": "string", "received": "undefined", "path": \["projectId"\], "message": "Required" } \], "name": "ZodError" } \], "path": \[\], "message": "Invalid input" } \] }
index-eiGMGof4.js:318284 WebSocket connection to 'wss://n8n.worksoftwares.com/rest/push?pushRef=2blj4fzher' failed: 
connect	@	index-eiGMGof4.js:318284

Information on my n8n setup

  • n8n version: n8nio/n8n:latest
  • Database (default: SQLite): mySQL
  • Running n8n via (Docker, npm, n8n cloud, desktop app): Docker (proxied via nginx container)
  • Operating system: kali-wsl

Here is my nginx conf

server {
  listen 80;
  server_name n8n.example.com;

  client_max_body_size 16M;

  location / {
    proxy_pass http://n8n-container:80;
    proxy_http_version 1.1;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
    proxy_set_header X-Forwarded-Host $host;
    proxy_set_header X-Forwarded-Port $server_port;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
    proxy_connect_timeout 60s;
    proxy_send_timeout 60s;
    proxy_read_timeout 60s;
    proxy_cache_bypass $http_upgrade;
    proxy_no_cache 1;
    proxy_redirect off;

    proxy_intercept_errors on;
  }

  error_page 404 = @spa_fallback;
  location @spa_fallback {
    # Rewrite the request to /index.html and proxy to backend
    rewrite ^ /index.html break;
    proxy_pass http://n8n-ai-agent:80;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
    proxy_set_header X-Forwarded-Host $host;
    proxy_set_header X-Forwarded-Port $server_port;
    proxy_redirect off;
    proxy_cache_bypass $http_upgrade;
    proxy_no_cache 1;
  }

  access_log /var/log/nginx/n8n_access.log;
  error_log /var/log/nginx/n8n_error.log;
}

Is this a configuration issue in n8n, nginx, or possibly something wrong with my environment variables or user permissions?
Is this WebSocket error related to the missing navigation bar/UI?

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