1

I'm trying to fetch data from api, as always i need to secure my token that backend given. Using useRuntimeConfig that documentation of Nuxt given. But This always getting undefined value of token.

<script setup lang="ts">
  interface User {
    nama: string;
  }

  const pending = ref(true)
  const data = ref < User > ()

  onMounted(async() => {
    const response = await fetch('/api/users', {
      headers: {
        'Content-Type': 'application/json',
        'Authorization': `Basic ${useRuntimeConfig().TOKEN}`,
      },
    })
    const users = await response.json()
    data.value = users
    pending.value = false
  })
</script>

Get solution that can store data from .env

8
  • What if you call and store useRuntimeConfig in a variable first? Commented May 13, 2024 at 17:42
  • @kissu It produces undefined. Also when console log that produce undefined at first render, and get the token when running ssr Commented May 14, 2024 at 2:22
  • Where are you checking? Browser console or terminal console? Both are different environments. Commented May 14, 2024 at 3:54
  • @kissu Both of them. Undefined in the browser and getting the value in the terminal console Commented May 14, 2024 at 6:31
  • There is no mounted lifecycle on the server. It's only client side. Commented May 14, 2024 at 11:04

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.