AMP Webpush Error: 'X-Frame-Options' to 'deny'

So I'm trying to implement webpush notifications for an AMP page, following the official documentation:

https://amp.dev/documentation/components/amp-web-push

But there is an issue when adding the <amp-web-push> component and specifying the helper-iframe-url that points to the amp-web-push-helper-frame.html, the one I've downloaded from the official page.

When I open my AMP page in browser, there are an error in the console:

Refused to display 'https://mytestsite.com/test/amp/amp-web-push-helper-frame.html?parentOrigin=https://mytestsite.com' in a frame because it set 'X-Frame-Options' to 'deny'.

And regarding that, I cant interact with the service worker. I took a look at the official AMP demo and there's no X-Frame-Options header with deny value.

This is my HTML templates:

AMP component:

<amp-web-push
        id="amp-web-push"
        layout="nodisplay"
        helper-iframe-url="https://mytestsite.com/test/amp/amp-web-push-helper-frame.html"
        permission-dialog-url="https://mytestsite.com/test/amp/amp-web-push-permission-dialog.html"
        service-worker-url="https://mytestsite.com/test/amp/service-worker.js">
</amp-web-push>

AMP widget

    <amp-web-push-widget visibility="unsubscribed" layout="fixed" width="245" height="45">
        <!-- Custom banner goes here... -->
    </amp-web-push-widget>

So I spent the whole day searching for solution and refactoring but still with the problem.

Solution

The X-Frame-Options header is defined by your backend server software or reverse proxy (nginx, apache, envoy, etc).

You have to change it to X-Frame-Options: sameorigin.