N8n Cloud – CORS issue with Embedded Chat despite setting Allowed Origins

Questions
1

I’m using n8n Cloud with a Chat node in Embedded chat mode.
The chat widget loads on my website, but when I want to send a message I get a CORS error in the browser console and there is no input field in the widget.
Could you please confirm if this is a known limitation/bug on n8n Cloud for Embedded chat, and if there is a recommended workaround?
I tried to Allow Origins, but still…
I even tried to host it on the same origin via webhook in the same n8n instance.

Error message on webhook hosting:

SecurityError: Failed to read the ‘localStorage’ property from ‘Window’: The document is sandboxed and lacks the ‘allow-same-origin’ flag.

  • n8n version: 2.4.8
  • Database (default: SQLite): sqlite
  • n8n EXECUTIONS_PROCESS setting (default: own, main): regular
  • Running n8n via (Docker, npm, n8n cloud, desktop app): n8n cloud
  • Operating system: macOS
2 Likes
2

Hey @nikoada,
Welcome to the community!

this is a recurring problem people encounter with the hosted/embedded chat widget on n8n Cloud, you are hitting 2 different but related errors:

Explanation of your errors:

  1. Recent versions of n8n wrap webhook HTML (including chat pages) in a sandboxed for security. Without allow-same-origin, the browser treats the chat page as a unique origin, which breaks access to things like localStorage and certain JS behavior, exactly the error you’re seeing. This has been reported as a bug on GitHub (e.g., issue about missing allow-same-origin in the sandbox).

  2. On Cloud, the hosted chat page often sends headers like X-Frame-Options: sameorigin which prevent it from being embedded in a different origin, even if you set Allowed Origins to * in the Chat Trigger node. That’s why people report the widget UI appearing but parts of it (like the input field) not working when embedded.

Do this: Instead of embedding the hosted page directly, use the official @n8n/chat widget on your own site. That script runs the chat app in your page’s own context, not inside the Cloud’s sandboxed iframe, so you don’t hit the localStorage/CORS/X-Frame problems. Setup looks like:

This gets you the full UI and avoids most iframe/CORS restrictions.

Let me know if it helps

2 Likes
3

Hi @nikoada, welcome back to our community!
You’re getting that error because the chat is running inside a sandboxed iframe that doesn’t allow same-origin access, so the browser blocks localStorage and the widget can’t initialize properly. Allow Origins in n8n won’t solve that. You need to either remove the sandbox attribute from the iframe or add allow-same-origin so the embedded chat can access localStorage correctly.

1 Like
4

Yeah this is a known Cloud limitation, the hosted chat page gets served inside a sandboxed iframe and Cloud also sends X-Frame-Options: sameorigin headers so cross-origin embedding just won’t work regardless of what you put in Allowed Origins. The workaround is to skip the “Embedded Chat” mode entirely and use the @n8n/chat widget script instead, it runs the chat directly in your page’s context so there’s no iframe involved at all. You just drop in the CDN link and call createChat() with your webhook URL, docs for that are here: https://www.npmjs.com/package/@n8n/chat

1 Like