Refused to display 'url' in a frame because it set 'X-Frame-Options' to 'deny'

Retired Boards Appdev Tools

Topic summary

Embedded Shopify app fails to render in an iframe on a Linux server due to the HTTP header X-Frame-Options: DENY. This header tells browsers to block framing; embedded apps must not send DENY.

Key guidance: Using koa-shopify-auth already handles OAuth/redirects; the issue is server headers. Ensure your web server does not set X-Frame-Options: DENY.

Resolution (for one setup):

  • Remove/override X-Frame-Options in Nginx (add_header X-Frame-Options “”).
  • Check included configs (e.g., cipherli.st ssl-params.conf) that may re-add DENY and remove it there.
  • Reload Nginx and verify via: wget -q --server-response https://your.url.com. Note: adding lusca xframe in Koa wasn’t needed in the final fix.

Ongoing issues: Some still see the error after adding add_header and proxy_hide_header, or after service restarts. One suggestion: use Cloudflare Workers to rewrite headers on the fly.

Open question: A redirect to Shopify domains (e.g., admin.shopify.com) returns X-Frame-Options: DENY from Shopify; users asked if it can be overridden. No confirmed solution in thread.

Status: Original poster’s issue resolved by removing server-set DENY. Broader cases involving upstream Shopify headers remain unresolved.

Summarized with AI on December 21. AI used: gpt-5.
9

Hi,

On our server on this redirect on the “/” route:

server.route({
path: ‘/’,
method: ‘GET’,
handler: function (request, reply) {
reply.redirect(‘https://apps.shopify.com/partners/widgetic’)
.header(‘Content-Security-Policy’, frame-ancestors https://${request.query.shop} [https://admin.shopify.com](https://admin.shopify.com))
.header(‘X-Frame-Options’, ‘ALLOW-FROM *’);
},
And even if we add the header, the "

https://admin.shopify.com/" comes with the ‘X-Frame-Options’ set on DENY.

});

Is there another way we could override it?