CODEWITHSUNDEEP
javascriptreact-nativeecmascript-6fetch
Kartiikeya
Kartiikeya

Reputation: 2516

Timeout for fetch - React Native

I'm using fetch to get data from server. I'm unable to set timeout for fetch in case of server didn't respond.

my global fetchData class

fetchGetResp(url, token) {
    return fetch(url, {
        method: "GET",
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',
        }
    })
    // .then(ApiUtils.checkStatus)
    .then(response =>
        response.json()
    )
    .then(responseJson => {
        return responseJson
    })
    .catch(error => {
        // console.log(error.headers._bodyText.status);
        console.log('touching undefined catch');
        return undefined;
    });
}

Javascript class where I'm accessing fetchData

let resp = fetchData.fetchGetResp(restUrl, userToken);
resp.then(responseJson => {
    // console.log(res);
    if (responseJson != '' && responseJson != undefined) {

    }
    else {
        console.log(responseJson);
        try {
        }
        catch (error) {
            alert(error.message);
            console.log(error + 'from js file');
        }
    }

    //Some if statement
    else {
        alert('Unable to Process.please try again');
    }
})
.catch(error => {
    alert(error.message + "Please try again after sometime");
});

Please let us how to implement timeout based on my above approach.

Upvotes: 2

Views: 4089

Answers (1)

Shashith Darshana
Shashith Darshana

Reputation: 2795

Fetch does not support for timeout option as of now (29/12/2017) but it is currently under discussion (discussion link).

But there is a way we can define our own wrapper to achieve that according to these documents. link1 link2

Therefore in your case 

function timeout(ms, promise) {
    return new Promise(function(resolve, reject) {
        setTimeout(function() {
            reject(new Error("timeout"))
        }, ms);
        promise.then(resolve, reject)
    })
};

timeout(1000, fetchData.fetchGetResp(restUrl, userToken)).then(responseJson => {
    // console.log(res);
    if (responseJson != '' && responseJson != undefined) {

    }else {
        console.log(responseJson);
        try {
        } catch (error) {
            alert(error.message);
            console.log(error + 'from js file');
        }

     }

}).catch(error => {
    alert(error.message + "Please try again after sometime");
});

Upvotes: 2

Related Questions