X-Frame-Options:SAMEORIGIN导致无法嵌入Zeppelin可视化至外部网站求助

Hey there, I’ve run into this exact scenario before—let’s break down why you’re seeing that X-Frame-Options: SAMEORIGIN header even when the config in zeppelin-site.xml.template is commented out, and how to get your Zeppelin visualizations embedded into other sites.

Common Causes & Solutions #

1. Zeppelin’s Default Configuration is Taking Over

The zeppelin-site.xml.template is just a blueprint—Zeppelin doesn’t use it directly. If you don’t have an actual zeppelin-site.xml file, Zeppelin falls back to its built-in default settings (which include X-Frame-Options: SAMEORIGIN). Here’s how to fix this:

• Navigate to your Zeppelin conf directory (usually $ZEPPELIN_HOME/conf).
• Copy the template to create a usable config file:

  cp zeppelin-site.xml.template zeppelin-site.xml
  

• Open zeppelin-site.xml in a text editor, find the zeppelin.server.xframe.options property, uncomment it, and set the value to your desired rule:

  <property>
    <name>zeppelin.server.xframe.options</name>
    <!-- Allow embedding from your specific target site -->
    <value>ALLOW-FROM https://your-embed-site.com</value>
    <description>X-Frame-Options header value. Defaults to SAMEORIGIN if not set. For broader (less secure) access, you can use an empty string, but this isn’t recommended for production.</description>
  </property>
  

• Restart Zeppelin to apply changes:

  bin/zeppelin-daemon.sh restart
  

2. Use Content-Security-Policy (CSP) for Better Browser Support

X-Frame-Options is somewhat outdated, and ALLOW-FROM has limited browser support. A more reliable alternative is to use the frame-ancestors directive in a Content-Security-Policy header. Add this property to your zeppelin-site.xml:

<property>
  <name>zeppelin.server.csp.header</name>
  <value>frame-ancestors https://your-embed-site.com;</value>
  <description>Content-Security-Policy header to control allowed embedding sources. This takes precedence over X-Frame-Options in modern browsers.</description>
</property>

3. Check Jetty’s Global Security Config

Zeppelin runs on Jetty by default, and Jetty might have a global filter that adds the X-Frame-Options header independently of Zeppelin’s settings:

• Look for Jetty’s web.xml or jetty.xml files (usually in $ZEPPELIN_HOME/lib/jetty-* or a dedicated jetty config folder).
• Search for filters setting X-Frame-Options—modify or remove that filter to match your embedding needs.

4. Reverse Proxy Might Be Injecting the Header

If you’re using Nginx, Apache, or another reverse proxy in front of Zeppelin, the proxy itself could be adding the X-Frame-Options header:

• For Nginx: Open your site’s config file, look for lines like add_header X-Frame-Options SAMEORIGIN;. Adjust it to allow your target site:

  add_header X-Frame-Options "ALLOW-FROM https://your-embed-site.com";
  # Or use CSP for better compatibility:
  add_header Content-Security-Policy "frame-ancestors https://your-embed-site.com;";
  

• For Apache: Check your .htaccess or virtual host config for Header set X-Frame-Options SAMEORIGIN and update it accordingly.

After making any of these changes, restart the relevant service (Zeppelin, proxy server) and test embedding your visualization again—use Chrome’s DevTools to verify the header is set correctly.

内容的提问来源于stack exchange，提问作者YamK