← Back to context

Comment by seer

25 days ago

Also it has interceptors, which allow you to build easily reusable pieces of code - loggers, oauth, retriers, execution time trackers etc.

These are so much better than the interface fetch offers you, unfortunately.

22 comments

seer

Reply
reactordev  25 days ago

You can do all of that in fetch really easily with the init object.

   fetch('https://api.example.com/data', {
  headers: {
    'Authorization': 'Bearer ' + accessToken
  }

})

  • zdragnar  25 days ago

    There are pretty much two usage patterns that come up all the time:

    1- automatically add bearer tokens to requests rather than manually specifying them every single time

    2- automatically dispatch some event or function when a 401 response is returned to clear the stale user session and return them to a login page.

    There's no reason to repeat this logic in every single place you make an API call.

    Likewise, every response I get is JSON. There's no reason to manually unwrap the response into JSON every time.

    Finally, there's some nice mocking utilities for axios for unit testing different responses and error codes.

    You're either going to copy/paste code everywhere, or you will write your own helper functions and never touch fetch directly. Axios... just works. No need to reinvent anything, and there's a ton of other handy features the GP mentioned as well you may or may not find yourself needing.

    • arghwhat  25 days ago

      Interceptors are just wrappers in disguise.

          const myfetch = async (req, options) => {
        let options = options || {};
        options.headers = options.headers || {};
        options.headers['Authorization'] = token;
    
        let res = await fetch(new Request(req, options));
        if (res.status == 401) {
            // do your thing
            throw new Error("oh no");
        }
        return res;
    }

      Convenience is a thing, but it doesn't require a massive library.

      8 replies →

    • abluecloud  24 days ago

      that's such a weak argument. you can write about 20 lines of code to do exactly this without requiring a third party library.

    • sayamqazi  25 days ago

      > usage patterns

      IMO interceptors are bad. they hide what might get transformed with the API call at the place it is being used.

      > Likewise, every response I get is JSON. There's no reason to manually unwrap the response into JSON every time.

      This is not true unless you are not interfacing with your own backends. even then why not just make a helper that unwraps as json by default but can be passed an arg to parse as something else

    • hiccuphippo  24 days ago

      One more use case for Axios is it automatically follows redirects, forwarding headers, and more importantly, omiting or rewriting the headers that shouldn't be forwarded for security reasons.

      1 reply →