Astro.site is empty when running on localhost

[sacred oak]

thus:
const canonicalURL = new URL(Astro.url.pathname, Astro.site) raise Error: Invalid URL

How can I get current hostname to build the URL?

[steep echo]

Hi @sacred oak. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

---

To get the current hostname and build the URL, you can use the Astro.url and Astro.site properties. Here's an example of how to construct a canonical URL:

const canonicalURL = new URL(Astro.url.pathname, Astro.site);

Astro.site returns a URL made from the site property in your Astro config. If site in your Astro config isn’t defined, Astro.site won’t be defined. Make sure you have set the site property in your Astro configuration:

{
  site: 'https://www.my-site.dev'
}

If you still encounter the "Invalid URL" error, ensure that both Astro.url.pathname and Astro.site have valid values. You can check their values by logging them:

console.log('Astro.url.pathname:', Astro.url.pathname);
console.log('Astro.site:', Astro.site);

If Astro.site is not defined, you can use Astro.url.origin as a fallback:

const canonicalURL = new URL(Astro.url.pathname, Astro.site || Astro.url.origin);

Sources:

• Astro.site (https://docs.astro.build/en/reference/api-reference#astrosite)
• Astro.url (https://docs.astro.build/en/reference/api-reference#astrourl)
• Astro configuration - site (https://docs.astro.build/en/reference/configuration-reference#site)

---

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

@sacred oak kapa.ai is still learning and improving, please let us how it did by reacting below