App must set security headers to protect against clickjacking

[fonya2014]

Hello everyone!

My app was rejected from the Shopify App Store due to the following reasons:

"App must set security headers to protect against clickjacking.
There was an error opening your app in the Shopify admin. Your embedded app is redirecting the top frame outside of the Shopify admin URL (https://app-security.myshopify.com/admin/charges/12273713153/24448532502/RecurringApplicationCharge/confirm_recurring_application_charge?signature=BAh7BzoHaWRsKwgWAD%2BxBQA6EmF1dG9fYWN0aXZhdGVU--d0aba71d1f6d4803b37682b546b315eefa879751). Embedded apps are expected to be rendered within the iframe."

I use the recent Shopify app template.

The security headers are implemented in this template in the following way:

app.use(express.json());

app.use((req, res, next) => {
  const shop = Shopify.Utils.sanitizeShop(req.query.shop);
  if (Shopify.Context.IS_EMBEDDED_APP && shop) {
    res.setHeader(
      "Content-Security-Policy",
      `frame-ancestors https://${encodeURIComponent(
        shop
      )} https://admin.shopify.com;`
    );
  } else {
    res.setHeader("Content-Security-Policy", `frame-ancestors 'none';`);
  }
  next();
});

I am testing the security headers according to this instruction: https://shopify.dev/apps/store/security/iframe-protection

And getting the following result:

Could you please let me know why the issue is happening for my app despite the test passes, and how to solve the issue?

Thank you!
Sofiia

[paulomarg]

Hi @fonya2014, it looks like you're setting up the appropriate headers. The failure for your submission might have been a false negative, but that issue is resolved now. Your app should pass if you re-submit it.

In the future, we encourage you to report this kind of issue to the support team rather than the template repository, as the support folks will be able to give you more accurate / timely information - there isn't much we can do from our side other than ensure the code looks sane (which it does!).