Attach custom headers before every fetch request in react native

Question

How can i configure my react application to attach some custom request before every http request? We had $httpProvider in angularjs for the same purpose. What is the way of doing it in react?

Answer 1

Just wrap the call in a function and add the headers?

global.FetchWithHeaders = async function(verb, url, data){
    const request = {
            method: verb,
            headers: { 'X-Auth-Token': '[Example Header Token]' }
        };

    if (data)    {
        request.body = JSON.stringify(data);
    }

    const responseObj = await fetch(url, request)
        .then(function(response){
            //Do something with response
            console.log(response);
        });

    return responseObj;
};

Could sit in a base Component or in global like above. Depends how you want to use it?