App must set security headers to protect against click jacking.

[Balouchi]

App must set security headers to protect against click jacking.
Your app must set the proper frame-ancestors content security policy directive to avoid click jacking attacks. The 'content-security-policy' header should set frame-ancestors https: //[shop]. myshopify.com https://admin.shopify.com, where [shop] is the shop domain the app is embedded on.

[wellbranding]

Have you found a solution? I set it with node cli app, still app is rejected

[wellbranding]

Have you found a solution? I set it with node cli app, still app is rejected

[Balouchi]

No Not Yet

[hidayahhtaufikk]

Hello, im have same solution, but i set headers on router

res.setHeader("Content-Security-Policy", `frame-ancestors https://${shop} https://admin.shopify.com;`)

[Balouchi]

Issued resolved ?

[wellbranding]

I solved it by adding this:

ctx.set('Content-Security-Policy', `frame-ancestors https://${session.shop} https://admin.shopify.com`);

To the

handleRequest

method in official Shopify Node JS CLI GitHub code 

[jdevmanzo]

I solved using a combination between @wellbranding's solution and the routes. Here is my solution:

router.get("/", async (ctx) => {
  const shop = ctx.query.shop;

  ACTIVE_SHOPIFY_SHOPS[shop] = await loadActiveShopifyShop(shop);
  // This evaluates if the shop exists already so it doesn't load each time server reload
  if (ACTIVE_SHOPIFY_SHOPS[shop] === undefined) {
    ctx.redirect(`/auth?shop=${shop}`);
  } else {
    // At this point the store is authenticated and shop var can be used
    ctx.set(
      "Content-Security-Policy",
      `frame-ancestors https://${shop} https://admin.shopify.com`
    );

    await handleRequest(ctx);
  }
});

After this, the frame-ancestor policy is authenticated and inserted correctly within the iFrame.

[camelmasa]

CSP frame-ancestors directive allows wildcard.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/frame-ancestors#sy...

So, I think we can configure the header like this

Content-Security-Policy: frame-ancestors https://*.myshopify.com https://admin.shopify.com;

[Mentis19]

I tried to use a wildcard, but my app keeps getting rejected.

Content-Security-Policy: frame-ancestors https://*.myshopify.com https://admin.shopify.com;

Do I require the store name to be dynamically added to the policy on a per request basis?

[camelmasa]

> Do I require the store name to be dynamically added to the policy on a per request basis?

Our member was allowed that by wildcard CSP.

Could you contact Shopify Staff about this?

[happy_ch57]

hi am facing same issue , but am not find the best way.

Am using laravel with shopify , but when am verify our app thats show eror. 

Anyone help me for solving this issue !

[rushikesh93]

have you got any specific solution for this issue, I get same issue in my app, and also I have developed the app using laravel+reactjs with shopify , I also don't know from where to add 'Content-Security-Policy' header