ampproject / ampproject/amphtml
Request to next posts page URL not working in AMP next page
- Dominant language
- JavaScript
- Stars
- 14.9k
- Forks
- 4.1k
- PR merge metrics
- No merged PRs in 30d
Description
### Description
# Context
I'm using `amp-next-page` component to build an infinite scroll experience in a web. I've added a REST endpoint that returns a JSON with keys `pages` that contains posts to render and `next` to request next posts page when all posts will be rendered as documentation says.
```JSON
{
"pages": [
{
"title": "Beta ART Enduro/SM (3.546-/3.576-)",
"image": "https://formulamoto.local/wp-content/uploads/2021/05/Beta-ART-50-2008-1.jpg",
"url": "https://formulamoto.local/beta/beta-art-enduro-sm-3546-3576-2/2678.html?amp=1"
},
{
"title": "Beta Alp 4.0 (5.193 -)",
"image": "https://formulamoto.local/wp-content/uploads/2021/05/Alp-4.0-2007-Orange.jpg",
"url": "https://formulamoto.local/beta/beta-alp-40-5193/5038.html?amp=1"
},
{
"title": "Beta ALP M4 (5.304-)",
"image": "https://formulamoto.local/wp-content/uploads/2021/05/M4_Black.jpg",
"url": "https://formulamoto.local/beta/beta-alp-m4-5304/1828.html?amp=1"
},
{
"title": "Beta RR400/500/520 (8.062-/8.062-/8.120-)",
"image": "https://formulamoto.local/wp-content/uploads/2021/05/DSC_5896.jpg",
"url": "https://formulamoto.local/beta/beta-rr400-500-520-8062-8062-8120/2420.html?amp=1"
},
{
"title": "Beta ART Enduro/SM (3.546-/3.576-)",
"image": "https://formulamoto.local/wp-content/uploads/2021/05/Beta-ART-50-2008.jpg",
"url": "https://formulamoto.local/beta/beta-art-enduro-sm-3546-3576/2667.html?amp=1"
},
{
"title": "Beta Urban 200/125/200 Special/125 Special (4.083 -/3.393 -/n.d./n.d.)",
"image": "https://formulamoto.local/wp-content/uploads/2021/05/3c.jpg",
"url": "https://formulamoto.local/beta/beta-urban-200-125-200-special-125-special-4083-3393-nd-nd/5178.html?amp=1"
},
{
"title": "Beta Alp 200/125 (4.426 -/3.741 -)",
"image": "https://formulamoto.local/wp-content/uploads/2021/05/Alp200_White.jpg",
"url": "https://formulamoto.local/beta/beta-alp-200-125-4426-3741/5164.html?amp=1"
}
],
"next": "https://formulamoto.local/wp-json/formulamoto-custom-amp/v1/next-page?page=3&category-id=13&before=2021-08-21 19:00:00"
}
```
# Problem
Next pages load as expected. But when all pages are loaded `amp-next-page` doesn't request next posts list given in `next` URL. Or it requests but an error is produced I don't know.
I open browser console and I see this repeated error.

I've tested my endpoint and it works. And because URL of the endpoint is put initially in src attribute of `amp-next-page` component. I've searching and there are [people with same problem](https://stackoverflow.com/questions/63604349/amp-next-page-json-configuration-optional-field-next-does-not-working).
### Reproduction Steps
1. Generate REST endpoint which returns JSON with pages list and URL endpoint for next page.
2. Insert `amp-next-page` component and put in `src` attribute endpoint URL.
3. Scroll down to the end of last post and check that new posts doesn't appear.
4. While scrolling, check browser console to see if same errors as described appear.
### Relevant Logs
_No response_
### Browser(s) Affected
_No response_
### OS(s) Affected
_No response_
### Device(s) Affected
_No response_
### AMP Version Affected
2202142035002
Contributor guide
Research direction
Reproduce the report with the amp-next-page entry point and the supplied JSON shape, then inspect the browser console and network request when the final page reaches the next URL. Confirm whether the next URL is requested and identify the failure; done means subsequent posts load without the repeated error.
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
- Needs clarification
- Newbie friendliness
- 30/100