fix: add csp header for iframe embedding (#1442)

docs_website/docs/configurations/infra_config.mdx

@@ -38,6 +38,10 @@ Otherwise you can also pass the environment variable directly when launching the
 
 `WS_CORS_ALLOWED_ORIGINS`: (**required for production**): This is the allowed list of origins for CORS. For dev environment, all origins will be allowed.
 
+### Iframe Embedding
+
+`IFRAME_ALLOWED_ORIGINS`: This is the allowed list for embedding Querybook in an iframe. By default it can only be embedded by itself.
+
 ### Database
 
 `DATABASE_CONN` (**required**): A sqlalchemy connection string to the database. Please check here https://docs.sqlalchemy.org/en/13/core/engines.html for formatting.

package.json

@@ -1,6 +1,6 @@
 {
     "name": "querybook",
-    "version": "3.33.3",
+    "version": "3.33.4",
     "description": "A Big Data Webapp",
     "private": true,
     "scripts": {

querybook/server/app/flask_app.py

@@ -51,6 +51,16 @@ def make_flask_app():
     if QuerybookSettings.TABLE_MAX_UPLOAD_SIZE is not None:
         app.config["MAX_CONTENT_LENGTH"] = int(QuerybookSettings.TABLE_MAX_UPLOAD_SIZE)
 
+    # Add Content-Security-Policy header to restrict iframe embedding to the allowed origins
+    csp_header_value = "frame-ancestors 'self' " + " ".join(
+        QuerybookSettings.IFRAME_ALLOWED_ORIGINS or []
+    )
+
+    @app.after_request
+    def add_csp_header(response):
+        response.headers["Content-Security-Policy"] = csp_header_value
+        return response
+
     return app
 
 

querybook/server/env.py

@@ -56,6 +56,7 @@ class QuerybookSettings(object):
     FLASK_SECRET_KEY = get_env_config("FLASK_SECRET_KEY", optional=False)
     FLASK_CACHE_CONFIG = get_env_config("FLASK_CACHE_CONFIG")
     WS_CORS_ALLOWED_ORIGINS = get_env_config("WS_CORS_ALLOWED_ORIGINS", optional=False)
+    IFRAME_ALLOWED_ORIGINS = get_env_config("IFRAME_ALLOWED_ORIGINS")
 
     # Celery
     REDIS_URL = get_env_config("REDIS_URL", optional=False)