ampproject / ampproject/amphtml

crossorigin attribute on amp-audio to support tracks hosted on different domain to story

Open
#38,262 4 comments 0 reactions 0 assignees View on GitHub
Component: amp-audio P3: When Possible Stale Type: Feature Request WG: components
Dominant language
JavaScript
Stars
14.9k
Forks
4.1k
PR merge metrics
No merged PRs in 30d

Description

### Description

Caption/subtitle tracks do not currently work with amp-audio. This may be because unlike amp-video it does not support/transfer the crossorigin="anonymous" attribute to the element which leads to errors of the following nature:

```
Unsafe attempt to load URL X.vtt from frame with URL Y. Domains, protocols and ports must match.
```

I've created a test story to demonstrate the problem:
https://stories.nws.ai/1288492465/audio-captions/

Support for `` in `` does seem flaky between browsers.
I've tested outside of AMP and it works in Chrome but not Firefox:
![image](https://user-images.githubusercontent.com/248400/171656401-e6eef747-18fd-46d8-acbd-d06f4d354c62.png)

### Alternatives Considered

The alternative would be to try and use `amp-video`. However, it doesn't seem to be able to play audio files, so the audio would have to be converted into a video file (additional processing for the user).

### Additional Context

_No response_

Contributor guide

Open the contributing guide

Research direction

Start by inspecting the amp-audio implementation and compare how amp-video handles the crossorigin="anonymous" attribute. Reproduce the caption-track case with the linked test story, then verify that cross-domain tracks load without the reported error across the relevant browsers.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 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.