ampproject / ampproject/amphtml

amp-recatcha document request is blocked because of Cross-Origin-Embedder-Policy

Open
#38,725 2 comments 0 reactions 0 assignees View on GitHub
Component: amp-recaptcha-input P1: High Priority Type: Bug WG: caching
Dominant language
JavaScript
Stars
14.9k
Forks
4.1k
PR merge metrics
No merged PRs in 30d

Description

### Description

I'm trying to use `amp-recaptcha` in a very basic `form`. Seems like the `iframe` request is blocked because of `Cross-Origin-Embedder-Policy` and as result, the form is unable to be used. `Allow this key to work with AMP pages` is checked on reCAPTCHA.

### Reproduction Steps

Import the `amp-recaptcha` script in `head`:

```html

```

In `body` add a `form`:

```html


Abonează-te

```

A live example can be found on https://afaceridigitalizate.ro/amp/ using the Newsletter form (id="newsletter") in the `footer`.

### Relevant Logs

```shell
Chrome warns that Cross-Origin-Embedder-Policy is not set:
To embed this frame in your document, the response needs to enable the cross-origin embedder policy by specifying the following response header:
`Cross-Origin-Embedder-Policy: require-corp`
```

### Browser(s) Affected

Chrome, Firefox

### OS(s) Affected

Windows 10

### Device(s) Affected

_No response_

### AMP Version Affected

2303151529000

Contributor guide

Open the contributing guide

Research direction

Start by reproducing the Newsletter form on the linked live AMP page in Chrome or Firefox, then inspect the amp-recaptcha-input-0.1.js component and the browser's Cross-Origin-Embedder-Policy warning. Done means the amp-recaptcha iframe request is no longer blocked and the newsletter form can be submitted in the reported setup.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.