Nuxt•2mo ago

Nuxt get Site Url

Is this the correct way to et the site url / set the ogImage url?

ogImage: new URL('/obsidianstake.svg', nuxtApp.$nuxtSiteConfig.url).toString(),

ogImage: new URL('/obsidianstake.svg', nuxtApp.$nuxtSiteConfig.url).toString(),

3 Replies

kapa.ai•2mo ago

Hi @Blouflash. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- I apologize, but I don't have enough accurate information from the provided knowledge sources to confirm if that specific code snippet is the correct way to get the site URL or set the ogImage URL in Nuxt. However, I can provide some relevant information about handling URLs and meta tags in Nuxt based on the available knowledge sources: 1. For setting Open Graph meta tags, Nuxt provides the useSeoMeta composable. You can use it like this:

useSeoMeta({
  ogImage: '<https://example.com/image.png',>
})

useSeoMeta({
  ogImage: '<https://example.com/image.png',>
})

Source: Nuxt Docs - SEO and Meta (https://nuxt.com/docs/getting-started/seo-meta#useseometa) 2. To access the current request URL in Nuxt, you can use the useRequestURL composable:

const url = useRequestURL()
console.log(url.toString())

const url = useRequestURL()
console.log(url.toString())

Source: Nuxt Docs - useRequestURL (https://nuxt.com/docs/api/composables/use-request-url) 3. For handling static assets like images, Nuxt recommends placing them in the public/ directory. Files in this directory are served at the root path and can be referenced directly:

useSeoMeta({
  ogImage: '/og-image.png'
})

useSeoMeta({
  ogImage: '/og-image.png'
})

Source: Nuxt Docs - Public Directory (https://nuxt.com/docs/guide/directory-structure/public) These approaches are more idiomatic in Nuxt 3. The code snippet you provided doesn't seem to match the standard Nuxt 3 patterns based on the information available in the knowledge sources. If you need more specific guidance, you might want to consult the official Nuxt documentation or provide more context about your specific use case. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•2mo ago

<@78895484986458112> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

harlan•2mo ago

Are you using Nuxt SEO? if so you can just use a relative link and it will be fixed for you otherwise you can use the getRequestHost(event) from h3 You can also just do defineOgImage({ url: '/obsidianstake.svg' }) if you use the OG Image module btw svg isn't well supported as an og image

Gaming

Programming

Nuxt get Site Url