e-geist opened a new issue, #22005: URL: https://github.com/apache/superset/issues/22005
Hi, we tried embedding a dashboard with the Superset Embed SDK and ran into CORS problems when trying to load the iframe cross origin. Embedding the dashboard with a local port-forward to the remote Superset works fine, as they have the same origin then (localhost). ### How to reproduce the bug 1. Host superset somewhere other than localhost. 2. Go to superset and allow embedding any dashboard for any url. 3. Build page using Superset Embed SDK and embed aforementioned Dashboard + appropriate code for login + guest token fetching (see below for minimal example). 4. Load built page locally (other origin than Superset) ### Expected results Dashboard is visibly embedded in page without errors. ### Actual results **HTTP request of embed sdk is answered with HTTP code 200, but prohibits embedding the content.** HTTP Header Response: ``` HTTP/2 200 OK access-control-allow-origin: * content-encoding: br content-security-policy: frame-ancestors http://* https://* content-type: text/html; charset=utf-8 date: Wed, 02 Nov 2022 11:30:04 GMT permissions-policy: interest-cohort=() referrer-policy: strict-origin-when-cross-origin server: gunicorn set-cookie: session=eyJjc3JmX3Rva2VuIjoiYzNiYTBhODVhZWFiMThmMWI0OGIwZDU4Y2FiMTVhNmIyM2I3OTA4ZSIsImxvY2FsZSI6ImVuIn0.Y2JUvA.5Fk-ksgyXTH6QVATgPGXrpAXT5M; Secure; HttpOnly; Path=/; SameSite=Lax strict-transport-security: max-age=31536000; includeSubDomains; preload vary: Accept-Encoding, Cookie x-content-type-options: nosniff x-frame-options: DENY x-xss-protection: 1; mode=block content-length: 24285 ``` HTTP Header Request: ``` GET /embedded/454cd010-3fcf-46f7-8ede-ae4ee7cfaca7?uiConfig=9 HTTP/2 Host: <remote page> User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:91.0) Gecko/20100101 Firefox/91.0 Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8 Accept-Language: de,en-US;q=0.7,en;q=0.3 Accept-Encoding: gzip, deflate, br Connection: keep-alive Referer: http://localhost:3000/ Upgrade-Insecure-Requests: 1 Sec-Fetch-Dest: iframe Sec-Fetch-Mode: navigate Sec-Fetch-Site: cross-site TE: trailers ``` ### Environment - browser type and version: Firefox 91.0, Microsoft Edge 107.0.1418.26 - superset environment: Kubernetes in Azure - Superset version: 2.0.0 (container from dockerhub with tag 2.0.0 + clickhouse-driver) with most up2date official helm-chart (0.7.6 at the time) - Superset Embed UI SDK: https://www.npmjs.com/package/@superset-ui/embedded-sdk/v/0.1.0-alpha.7 - used via [unpkg](https://unpkg.com/@superset-ui/embedded-sdk) - relevant config options from helm-chart values.yaml: ``` # flask_conf WTF_CSRF_ENABLED = False SESSION_COOKIE_SAMESITE = None ENABLE_CORS = True CORS_OPTIONS = { "send_wildcard": True, "allow_headers": ["*"], "resources":["*"], "origins": ["*"] } # talisman_config TALISMAN_ENABLED = True TALISMAN_CONFIG = { "content_security_policy": "frame-ancestors http://* https://*";, "force_https": False, "force_https_permanent": False, "frame_options": "ALLOWFROM", "frame_options_allow_from": "*" } GUEST_ROLE_NAME = 'Guest_role_name_with_enough_permissions' GUEST_TOKEN_JWT_SECRET = "test_secret" GUEST_TOKEN_JWT_ALGO = "HS256" GUEST_TOKEN_HEADER_NAME = "X-GuestToken" GUEST_TOKEN_JWT_EXP_SECONDS = 3600 FEATURE_FLAGS = { "EMBEDDED_SUPERSET": True, "DASHBOARD_RBAC": True } ``` ### Checklist Make sure to follow these steps before submitting your issue - thank you! - [x] I have checked the superset logs for python stacktraces and included it here as text if there are any. - [x] I have reproduced the issue with at least the latest released version of superset. - [x] I have checked the issue tracker for the same issue and I haven't found one similar. ### Additional context #### Previously worked successfully For a very short amount of time (1.5d) embedding worked flawlessly. We thought it might have sth to do with the Superset version - but neither 2.0.0 nor latest (top of master) worked. #### CORS options We tried different combinations of CORS and Talisman options, but neither of them worked. It seems that no matter what options are chosen, **x-frame-options is always "DENY"** Overwriting HTTP_HEADERS with HTTP_HEADERS = {} or any other values doesn't have an effect either. #### Python logs Login and guest token retrieval are logged as successful in logs. When retrieving embedded dashboard, a warning is shown: ``` 2022-11-02 11:30:04,259:WARNING:root:Class 'werkzeug.local.LocalProxy' is not mapped 10.244.6.170 - - [02/Nov/2022:11:30:04 +0000] "GET /embedded/454cd010-3fcf-46f7-8ede-ae4ee7cfaca7?uiConfig=9 HTTP/1.1" 200 24285 "http://localhost:3000/"; "Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:91.0) Gecko/20100101 Firefox/91.0" ``` #### Minimal embedding code Embedding was also tried in other environments (Website with PHP backend) and doesn't work either. Frontend (embedded in pretty empty HTML document) ``` var fetchGuestTokenFromBackend = async function () { response = await fetch("http://localhost:3000/fetchGuestToken";, { method: 'POST' }) responseText = await response.text() return responseText }; supersetEmbeddedSdk.embedDashboard({ id: "454cd010-3fcf-46f7-8ede-ae4ee7cfaca7", // given by the Superset embedding UI supersetDomain: <superset_domain>, mountPoint: document.getElementById("my-superset-container"), // any html element that can contain an iframe fetchGuestToken: fetchGuestTokenFromBackend, dashboardUiConfig: { hideTitle: true, hideChartControls: true } }); ``` Backend for frontend (Node with express js and got for requests): ``` app.post('/fetchGuestToken', async (req, res) => { const responseLogin = await got.post('<superset_domain>/api/v1/security/login', { json: { username: <guest_token_user>, password: <guest_token_user>, provider: 'db' } }).json() const responseGuestToken = await got.post("<superset_domain>/api/v1/security/guest_token/", { json: { "user": { "username": "someuser", "first_name": "MyApp User", "last_name": "MyApp User" }, "resources": [{ "type": "dashboard", "id": "454cd010-3fcf-46f7-8ede-ae4ee7cfaca7" }], "rls": [{ "clause": "sth = 'sth'" }] }, headers: { "Authorization": `Bearer ${responseLogin.access_token}` } }).json(); res.send(responseGuestToken.token) }); ``` We are not sure whether this is a problem on the embedding SDK side or Superset itself. If any information is missing or we can try some other options please let us know, as we need to rely on this feature in the near future. Thank you very much! -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: [email protected] For queries about this service, please contact Infrastructure at: [email protected] --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
