Get query params from the URL

[peak pewter]

is there any way to pick params from the URL?
I'm trying to figure out how to recycle the same page component for multiple purposes.

Here's a detailed explanation for what I'm trying to do:
-> I have a game.astro page component which will display a game with a generic <iframe>. The src will be the only thing changing between games.

->When I click to a header button saying something like <a href="/game?url=https//www.example.com> I want to be able to pick that URL as a variable in game.astro so it will be able to display that specific game instead of the others.
Any ideas?

I couldn't find anything useful to my case in the documentation and Chat GPT is completely clueless sometimes

[river vessel]

Quiet in here?

It looks like no-one has responded to your question yet. People might not be available right now or don’t know how to answer your question. Want an answer while you wait? Try asking our experimental bot in #1095492539085230272.

[peak pewter]

I've made some progress so far. I was able to retrieve the query params with JS. My problem now is that I don't know how to pass the JS variable from <script> to an Astro variable. Here's my code:
`---
import Unity from "../components/Unity.vue";
import Showcase from "../components/Showcase.astro";
import Layout from "../layouts/Layout.astro";

<Layout title="Blog">
<Showcase
heading="Balls of Steel"
text="Remain the sole ball on the platform"
/>
<section class="page-content">
<Unity :param="params" />
</section>
</Layout>

<script>
const urlSearchParams = new URLSearchParams(window.location.search);
const params = Object.fromEntries(urlSearchParams.entries());
console.log(params);
</script>`

this line <Unity :param="params" /> is the most important. I want to pass the params from the <script> to the Unity.vue component

[dapper crypt]

I think you might be misunderstanding when things are running

Your Astro template runs on the server, your script tags run on the client

You can't pass information from the client to the server, since the server has already generated the page by then

[peak pewter]

So, there's no way ?

😢

It makes sense though

[dapper crypt]

Not really, it's quite literally technologically impossible with this architecture 😅

If you need to get the query params on the server, you'll need to use SSR

[peak pewter]

And how could I reuse the same page component by passing URL variables? or something similar at least?

[dapper crypt]

What you probably want to do, is render more things on the client. Your Unity component could run on the client and render different content depending on the params