fetch-ajax.js

/**
 * Promise-based wrapper around fetch that will reject promises for
 * requests that fail with a non-200 response code.
 */
import _ from 'underscore'
import Promise from 'promise'

const getDefaultOpts = () => {
    return {
        type: 'json'
    }
}

const getQueryString = obj => {
    return _.reduce(obj, (memo, val, key) => {
        return memo + `${key}=${encodeURIComponent(val)}&`;
    }, '?').slice(0,-1)
}

const filterOpts = (method, endpoint, data = null, opts = {}) => {
    // Filter hook that can be utilized if we need to do something with the
    // request based on url or properties in the opts object
    //
    // Currently just used to merge in default request options
    opts = Object.assign({}, getDefaultOpts(), opts, { method })
    if ( method === 'post' || method === 'put' || method === 'patch' ) {
        opts.body = JSON.stringify(opts.data)
    }

    if ( opts.type === 'json' ) {
        let newHeaders = opts.headers || {}
        newHeaders['Accept'] = 'application/json'
        newHeaders['Content-Type'] = 'application/json'
        opts.headers = newHeaders
    }

    return opts;
}

const parseResponse = res => {
    return res.json();
}

const onRequestComplete = (res) => {
    if ( res.status < 200 || res.status >= 300 ) {
        console.log("Response: ", res);
        var error = new Error(res.statusText)
        error.response = res;
        return onRequestFail(error);
    }

    return parseResponse(res);
}

const onRequestFail = (err) => {
    console.warn('Request failed: ', err);
    return new Promise((resolve, reject) => {
        reject(err);
    })
}

export function get(endpoint, data, opts = {}) {
    if (data) {
        endpoint = endpoint + getQueryString(data);
    }

    return fetch( endpoint, filterOpts('get', ...arguments) )
        .then(onRequestComplete)
        .catch(onRequestFail);
}

export function post(endpoint, data, opts = {}) {
    return fetch( endpoint, filterOpts('post', ...arguments) )
        .then(onRequestComplete)
        .catch(onRequestFail);
}

export function put(endpoint, data, opts = {}) {
    return fetch( endpoint, filterOpts('put', ...arguments) )
        .then(onRequestComplete)
        .catch(onRequestFail);
}

export function patch(endpoint, data, opts = {}) {
    return fetch( endpoint, filterOpts('patch', ...arguments) )
        .then(onRequestComplete)
        .catch(onRequestFail);
}

export function destroy(endpoint, data, opts = {}) {
    return fetch( endpoint, filterOpts('delete', ...arguments) )
        .then(onRequestComplete)
        .catch(onRequestFail);
}