'Missing configuration in AWS amplify custom headers

Having a hard time with setting custom headers up to prevent cross side scripting on an Amplify App.

This is the configuration:

customHeaders:
  - pattern: '**/*'
    headers:
      - key: Strict-Transport-Security
        value: max-age=31536000; includeSubDomains
      - key: X-Frame-Options
        value: deny
      - key: X-XSS-Protection
        value: 1; mode=block
      - key: X-Content-Type-Options
        value: nosniff
      - key: Content-Security-Policy
        value: frame-ancestors 'none'

When loading the site in an iframe like so:

<html>
<head></head>
<body>
<h1>IFRAME blocked</h1>

<iframe width=100% height=100% src="https://foo.bar/"></iframe>

</body>
</html>

Then the iFrame is successfully blocked.

But when loading the iframe like this:

<html>
<head></head>
<body>
<h1>IFRAME Not blocked</h1>

<iframe width=100% height=100% src="https://foo.bar/login"></iframe>

</body>
</html>

Then the iFrame is rendering the page.

Any ideas how to extend the custom header configuration to also include any additional "path" of the url?



Solution 1:[1]

Please try this X-Frame-Options: ALLOW-FROM URL

Details

  1. X-Frame-Options: DENY It completely denies to be loaded in frame/iframe.
  2. X-Frame-Options: SAMEORIGIN It allows only if the site which wants to load has a same origin.
  3. X-Frame-Options: ALLOW-FROM URL It grants a specific URL to load itself in a iframe. However please pay attention to that, not all browsers support this.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Syed Sarosh Zaidi