Является ли ajax лучшим / единственным способом добавления jsonwebtoken (JWT) в заголовок запроса?

Question

У меня есть простой многостраничный сайт, написанный на vanilla JS, Pug и Node, который использует вход в систему с помощью JWT.Когда пользователь входит в систему, клиенту возвращается JWT.JWT хранится в localStorage.Теперь, когда пользователь щелкает ссылку на защищенный маршрут на данной странице, мне нужно отправить JWT на сервер, чтобы он мог подтвердить подлинность JWT (т. Е. Пользователь вошел в систему).

Я понимаю, что могу сделать что-то подобное для данного защищенного маршрута:

$.ajax({
    url: "/protected",
    type: "GET",
    headers: {
      'Authorization': 'Bearer ' + <token>
    }
    success: (res) => {
      if (res.status == 200) {
        window.location.replace("/profile");
      }
      else {
        window.location.replace("/login");
      }
    },
    error: (err) => { console.log(err) }
  });

Кажется, что для простого щелчка ссылки требуется много времени.Это рекомендуемый метод добавления JWT в заголовок запроса или есть лучший способ?

Answer 1

Да, во многом это единственный способ. Но чтобы упростить ваши действия, вы можете создать обертку над методом ajax и использовать эту функцию для защищенных маршрутов.

function authAjax(url, method, successCallback, errorCallback){
  $.ajax({
    url: url,
    type: method,
    headers: {
      'Authorization': 'Bearer ' + <token>
    }
    success: (res) => {
      if (res.status == 200) {
        successCallback(res)
      }
      else {
        window.location.replace("/login");
      }
    },
    error: (err) => {
      console.log(err) 
      errorCallback(err)
    }
  });
}

И используйте это как:

authAjax('/protected', 'GET', (data) => {
  console.log('API res', data)
}, (err) => {
  alert('Sorry, Something went wrong :(')
})