Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Query parameters lost and function inconsistently #11434

Closed
1 task
MikeCarbone opened this issue Jul 9, 2024 · 2 comments
Closed
1 task

Query parameters lost and function inconsistently #11434

MikeCarbone opened this issue Jul 9, 2024 · 2 comments
Labels
needs response Issue needs response from OP

Comments

@MikeCarbone
Copy link

Astro Info

Astro                    v4.10.3
Node                     v18.17.1
System                   macOS (x64)
Package Manager          npm
Output                   server
Adapter                  @astrojs/vercel/serverless
Integrations             @astrojs/mdx
                         @astrojs/sitemap
                         @astrojs/react

If this issue only occurs in one browser, which browser is a problem?

No response

Describe the Bug

When using query parameters for navigation, in production we lose the query parameters. Take this simple page for example:

---
const page = Astro.url.searchParams.get("page");
const res = await fetch(`${API_URL}/links?page=${page}`);
const data = await res.json();
---
<!doctype html>
<html lang="en">
  <body>
     { data.map((p) => <div>{p.title}</div> }
     <a href={`/links?page=${page + 1}`}>Next page</a>
   </body>
</html>

This works locally. As expected, clicking the "Next page" button will navigate to the next page and new data will show.

However when deployed (with Vercel), the page will navigate with the query parameters, but the query parameters are not sent to the API. I'm not sure if this is a Vercel problem, an Astro problem, or a me problem.

In the StackBlitz example, it's even simpler and doesn't function as I'd expect.

What's the expected result?

I expect query parameters to consistently hold the state. In the StackBlitz, I expect the query parameter to increment. I expect this to work in production. What am I missing?

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-pdcl2d?file=src%2Fpages%2Findex.astro

Participation

  • I am willing to submit a pull request for this issue.
@github-actions github-actions bot added the needs triage Issue needs to be triaged label Jul 9, 2024
@ematipico
Copy link
Member

This works locally. As expected

This isn't expected: https://docs.astro.build/en/reference/api-reference/#astrorequest

With the default output: 'static' option, Astro.request.url does not contain search parameters, like ?foo=bar, as it’s not possible to determine them ahead of time during static builds. However in output: 'server' mode, Astro.request.url does contain search parameters as it can be determined from a server request.

@ematipico ematipico added the needs response Issue needs response from OP label Jul 19, 2024
@Princesseuh Princesseuh removed the needs triage Issue needs to be triaged label Jul 30, 2024
@bluwy
Copy link
Member

bluwy commented Jul 30, 2024

I tested locally and you can't access the searchParams either, which is intended as the page is prerendered and can't read the search params ahead of time. I'll close this for now as further explained by Ema as why this works the way it is.

@bluwy bluwy closed this as not planned Won't fix, can't repro, duplicate, stale Jul 30, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
needs response Issue needs response from OP
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@ematipico @Princesseuh @MikeCarbone @bluwy