從 axios 訪問不記名令牌

Question

我可以使用什么代碼來訪問存儲在 localStorage 中的不記名令牌？

const apiClient = axios.create({
  baseURL: 'http://localhost:5000/api/v1',
  withCredentials: false,
  headers: {
    Accept: 'application/json',
    'Content-Type': 'application/json'.
    Authorization: ???
  }
});

我在使用 axios 服務發送身份驗證標頭時遇到問題。 當我對現有的不記名令牌進行硬編碼時，它可以工作，但是如何在更改時為每個用戶動態訪問它？

Answer 1

這就是有效的！ 感謝 DigitalDrifter 向我展示了 localStorage 中的 getItem 函數。

我一直將不記名令牌存儲在“用戶”狀態，因此我檢索了該對象，對其進行了解析，然后將其插入到 Authorization 標頭中。

const user = JSON.parse(localStorage.getItem('user'));
const token = user.token;

const apiClient = axios.create({
  baseURL: 'http://localhost:5000/api/v1',
  withCredentials: false,
  headers: {
    Accept: 'application/json',
    'Content-Type': 'application/json',
    Authorization: `Bearer ${token}`
  }
});

Answer 2

請求攔截器可用於在每個傳出請求之前設置Authorization標頭。

// Add a request interceptor
axios.interceptors.request.use(function (config) {
    let token = localStorage.getItem('bearer_token')

    if (token) {
        config.headers.Authorization = `Bearer ${token}`
    }


    return config;
  }, function (error) {
    // Do something with request error
    return Promise.reject(error);
  });