petruisfan / ionic-ajax-interceptor

Ajax interceptor for $http, designed for ionic
7 stars 5 forks source link

ionic-ajax-interceptor

Ajax interceptor for $http, designed for ionic.

This library is meant to make working with ajax calls much simpler. It's functionalities include:

How to use:

1) Install it:

$ bower install ionic-ajax-interceptor --save

2) Add the js to your html:

<script src="https://github.com/petruisfan/ionic-ajax-interceptor/raw/master/lib/ionic-ajax-interceptor/dist/ionic-ajax-interceptor.min.js"></script>

3) Configure your module:

angular.module('app', ['ionic', 'ionic-ajax-interceptor'])
    .config(function( AjaxInterceptorProvider ) {
        AjaxInterceptorProvider.config({
            title: "Bummer",
            defaultMessage: "I crashed :(",
            transformRequest: function(data) {
                data.someKey = "Some value:";
                return data;
            }
        });
    }))
    .run(function (AjaxInterceptor) {
        AjaxInterceptor.run();
        ...
    })

4) Use it just like $http:

var request = {
    method: 'GET',
    url: Constants.endpoint + "/json",
    iCache: {
        expires: new Date().getTime() + 1000 * 60 // in one minute
    }
};

AjaxService.http(request).then(
    function success(res) {
        ...
    },
    function error(err) {
        ...    
    }
);

Now every time you make a $http request, while the request is in progress, there will be a spinner in front:

Example

Authorization token

$http requests can have an authorization header added to each request. just do a:

AjaxInterceptor.setAuthorizationToken(<some token>);

and all the following request will have a header added automagically :)

UI-router state change error

Every time a resolve fails in a state, a $ionicPopup confirm is shown. If the resolve failed and the error argument has a "message" key, it will be shown in alert body:

Example

Available options:

Key Type Default Why?
stateChangeError boolean true Show a ionic alert every time a "resolve" value failed to return in angular-ui-router.
title string Error The title of the alert
defaultMessage string Unknown error The body of the alert
authorizationHeader string Authorization key header to add
authorizationToken string null value of the header
fallbackIp string null Add a fallback ip. For example if the server DNS is not resolved, try to access it by IP.
iCache Object null Add caching capabilities
iCache.key string request url The key under which to save the response
iCache.expires timestamp null When should the cached data expire? Null = never
transformRequest function null Function applied to transform request. Must return the data
transformResponse function null Function applied to transform response. Must return the data

Methods

Name Arguments Why?
config options Use it in a config block to configure available options mentioned above
run - Set the interceptors for $http requests. Call this in the run block before other $http calls
setAuthorizationToken token Add an 'authorization' header with token value
showLoading - Show the loading screen. Useful for long running tasks or other remote operations like connecting to bluetooth
hideLoading - Hide the loading screen

AjaxService

AjaxService is a service that can be used the same way as $http, but has the added cache functionality. It has 3 methods: