ampproject / ampproject/amphtml
Web Story video playback fails due to SEC_ERROR_EXPIRED_CERTIFICATE
- Dominant language
- JavaScript
- Stars
- 14.9k
- Forks
- 4.1k
- PR merge metrics
- No merged PRs in 30d
Description
### Description
Sometimes Web Story fails to play video from origin after missing Google's cache due to SEC_ERROR_EXPIRED_CERTIFICATE. The page is blank and there's an error "Video failed to play": https://photos.app.goo.gl/AjLU3cvk3Pr8pLuZ7
### Reproduction Steps
Reproducible on desktop and mobile.
1. Open Chrome, Safari or Firefox.
2. Search for "oita +site:stories.jleague.co": https://photos.app.goo.gl/mxnBgtKoVMM5doQQ9
3. Start opening links until you get blank grey story page with error "Video failed to play": https://photos.app.goo.gl/AjLU3cvk3Pr8pLuZ7
4. Open dev tools -> Network, reload the page. The error persists.
5. Filter requests list by "mp4". Note that requests to Google cache returned 404, so AMP runtime tried to fall back to origin. https://photos.app.goo.gl/fA6WP3Cj8bVU3EM18
6. Falling back to origin fails due to SEC_ERROR_EXPIRED_CERTIFICATE: https://photos.app.goo.gl/fA6WP3Cj8bVU3EM18
7. A few minutes later the same page will start working, videos being served from Google cache (it takes a few minutes for Google to ingest).
8. After this try other pages via search "oita +site:stories.jleague.co". The error disappears even for pages that miss Google cache.
9. Now try different browser or different device. Search again, try multiple links -> error appears again. Important: DO NOT open the same link that failed in step 3. If you open it, videos will be loaded from Google cache, which seems to fix the certificate issue, and the error won't reproduce any more in this browsing session. However if you skip that search result and try others, the error appears again. So looks like the certificate issue is resolved in step 7, but only for the browsing session.
### Relevant Logs
```shell
Google cache request for first page video gets 404, origin request for same video gets SEC_ERROR_EXPIRED_CERTIFICATE:
https://photos.app.goo.gl/fA6WP3Cj8bVU3EM18
Notably only first video is not in Google cache, the rest are:
https://photos.app.goo.gl/n1gKkAahKifxpyak9
```
### Browser(s) Affected
Chrome, Firefox, Safari
### OS(s) Affected
_No response_
### Device(s) Affected
iOS, Android
### AMP Version Affected
_No response_
Contributor guide
Research direction
Start by reproducing the blank Web Story page and inspect DevTools Network requests for the mp4 request, comparing the Google cache 404 with the origin SEC_ERROR_EXPIRED_CERTIFICATE failure. Done means establishing a supported fix for video playback when cache ingestion has not completed, then verifying the behavior across the affected browsers and devices.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend, web-dev
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100