huggingface / chat-ui

Open source codebase powering the HuggingChat app
https://huggingface.co/chat
Apache License 2.0
7.52k stars 1.1k forks source link

iframe throws 403 error when sending a message #1367

Open rodrigobdz opened 3 months ago

rodrigobdz commented 3 months ago

Issue

Use case: I would like to embed the Chat UI in an iframe in Qualtrics.

Issue: Sending a message from the Chat UI in an iframe results in 403 error with the message below.

You don't have access to this conversation. If someone gave you this link, ask them to use the 'share' feature instead.

When the disclaimer was shown, a new tab was opened after dismissing it. Thus, I removed the disclaimer hoping that Chat UI in the iframe would work. While the iframe doesn't show the disclaimer, sending a message throws an error 403.

Unsuccessful fix attempts

As suggested in https://github.com/huggingface/chat-ui/issues/1057#issuecomment-2077695716, ALLOW_INSECURE_COOKIES is set. I also tried setting PUBLIC_ORIGIN to both the URL of my self-hosted Chat UI and to the Qualtrics website that shows the iframe, but none worked—i.e., the 403 error is still shown.

.env.local

ALLOW_INSECURE_COOKIES=true

Related

rodrigobdz commented 3 months ago

Errors shown in the browser console, where myqualtrics and mychatui are placeholders:

Access to internal resource at 'https://myqualtrics/chatui/manifest.json' from origin 'https://mychatui' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

SecurityError: Blocked a frame with origin from accessing a cross-origin frame

nsarrazin commented 3 months ago

Any chance you could host chat-ui and qualtrics on the same domain name ? Otherwise the session cookie for the embedded iframe will be treated as a third party cookie which will break auth (and give you the 403 error you're seeing)

We were having similar issues between the space on the hub displaying the iframe: https://huggingface.co/spaces/huggingchat/chat-ui/ and the chat-ui space itself: https://huggingchat-chat-ui.static.hf.space/

rodrigobdz commented 3 months ago

Unfortunately, hosting the two on the same domain name will not be possible.

Where is the error coming from? Are there any alternatives available?

rodrigobdz commented 2 months ago

If you point me in the right direction, I could take a look at a potential PR to fix this issue in chat-ui.

KartikGS commented 2 months ago

This line is confusing me.

sameSite: dev || env.ALLOW_INSECURE_COOKIES === "true" ? "lax" : "none", secure: !dev && !(env.ALLOW_INSECURE_COOKIES === "true")

Shouldn't the none be strict or none and lax be swapped. And if we are using none shouldn't secure always be true.

KartikGS commented 2 months ago

It works for me with the following change in code:

sameSite: dev || env.ALLOW_INSECURE_COOKIES === "true" ? "none" : "lax", secure: true,

in auth.ts, instead of:

sameSite: dev || env.ALLOW_INSECURE_COOKIES === "true" ? "lax" : "none", secure: !dev && !(env.ALLOW_INSECURE_COOKIES === "true"),

Insecure_cookies.webm