Как передать токен в запросе к API?

Требуется получить данные от сервера по API На моменте авторизации мне возвращается токен, который сейчас сохранен в localstorage. Как его передать в GET запрос для получения данных ?

<template>
    <div class="lk">
        <h2>Личный кабинет сотрудника</h2>
        {{posts}}
    </div>
</template>
<script>
import {mapState} from "vuex";

    export default{
    name: 'lk',
    data(){
        return{
            'posts': [] 
        }
    },
    async mounted() {
        let lk = await fetch('http://10.1.5.65/api/personal/users/');
        let posts = await lk.json();
        this.posts = posts
    },
    computed: {
        ...mapState({
        user: state => state.user
        })
    }
}
    </script>


import Vuex from 'vuex'
import createPersistedState from "vuex-persistedstate";

const store = new Vuex.Store({
  state: {
    user: {}
  },
  mutations: {
    setUser(state, user) {
      state.user = user
    }
  },
  actions: {
  },
  plugins: [createPersistedState()],
})

export default store


Ответы (1 шт):

Автор решения: doox911
  1. Необходимо получить токен из localStorage:
async mounted() {
  const token = localStorage.getItem('token') // Или ваш ключ хранения токена
},
  1. Передаём его в fetch:
async mounted() {
  const token = localStorage.getItem('token') // Или ваш ключ хранения токена

  if () {
    await fetch('http://10.1.5.65/api/personal/users/', {
      method: 'GET',
      headers: {
        Authorization: `Bearer ${token}`,  
      }
    });
  } else {
    // Что-то если вдруг нет токена
  }
},

Так же доп. материал.

→ Ссылка