Как правильно переопределить XmlHttpRequest для передачи пользовательского ключа и значения в заголовках

Question

Я пытался переопределить функцию XmlHttpRequest для получения настраиваемого заголовка, который хранится в localStorage, поэтому при любом запросе мой настраиваемый заголовок будет там.Также было бы идеально , чтобы этого можно было достичь, используя только ванильный JavaScript, без Jquery

. Я пытался создать класс с методом переопределения, создав прототип методов open и send, используя setRequestHeader.установить заголовок

Он должен был переопределить встроенную функцию xmlhttprequest, теперь получающую заголовок "UserToken"

class overrideXmlHTTPRequest {
  static override() {
    const token = localStorage.getItem('userToken')
    const xhttp = new XMLHttpRequest()
    const xhrProto = XMLHttpRequest.prototype
    const origOpen = xhrProto.open

    xhrProto.open = function(method, url) {
      this._url = url
      return origOpen.apply(this, arguments)
    }
    xhrProto.send = function() {
      xhrProto.setRequestHeader('UserToken', token)
    }
  }
}

export default overrideXmlHTTPRequest