Nuxt: Dynamic head / meta title is undefined on ssr

I have a nuxt project, where the meta title and description comes (from nuxt/content). The async fetch for the data is made in index and received in a sub component via a getter.

On generate, the meta tags are there but on ssr not :/

I tried it with async and await, but I still get the error

Uncaught (in promise) TypeError: seoTitle is undefined

(I tried it with a useless await this.getArticle const, in hope that the whole thing waits, this stuff is there, but no)

Here my code:

 async head() {
    const article = await this.getArticle
    const seoTitle = await this.getArticle.seoTitle,
      title = await this.getArticle.title,
      seoDescription = await this.getArticle.description

    return {
      title: `"${
        seoTitle.length ? seoTitle : title
      }"`,
      meta: [
        {
          hid: "description",
          name: "description",
          content: `${
            seoDescription.length
              ? seoDescription.slice(0, 50)
              : seoDescription.slice(0, 50)
          }`,
        },
      ],
    };
  },

Answer

To my knowledge, you cannot use async on head because it is usually using some static values.

And looking at this github answer, it looks like you can use asyncData to have access to the values you want to input in head.

head() {
  return { title: this.info.title }
},
async asyncData ({ params }) {
  return axios.get(`/post/${params.id}/info`)
    .then((res) => {
      return {
        info: res.data.info
      }
    }).catch((err) => {
      console.log(err)
  })
},