Rx-Ajax

Super simple (but advanced) ajax reactive library. Using RxJS. Supports sending files.

Installation

$ npm install rx-ajax

Usage

import {Http} from 'rx-ajax';

let http = new Http;
let data = {number: 5};
let options = {};

http.request('/users', 'GET', data, options).subscribe((response) => {
	console.log(response.json());
});

Shortcuts

http.get('/api', data, options).subscribe((response) => {});
http.post('/api', data, options).subscribe((response) => {});
http.files('/api', filesList, data, options).subscribe((response) => {});

Options

• jsonp: name of callback for jsonp requests, when true is given callback name is used. Default is false
• jsonPrefix: prefix for json requests. Read more here. Default is null
• mimeType: Default is null
• headers: List of headers to be send to server. Default is {}
• files: List of files to be send to server. Default is []

Queue

By default all your requests are called from queue one by one, so there is always just one request running (or zero). Inspiration is from this article http://blog.alexmaccaw.com/queuing-ajax-requests.

You can disable this feature with ImmediateQueue:

import {Http} from 'rx-ajax';
import {ImmediateQueue} from 'rx-ajax/queue';

let http = new Http({
	queue: new ImmediateQueue
});

Events

http.send.subscribe(function(response, request) {
    console.log('In any moment, new http request will be send to server');
});

http.afterSend.subscribe(function(response, request) {
    console.log('I just sent some request to server, but there is still no response');
});

http.success.subscribe(function(response, request) {
    console.log('I have got response from server without any error :-)');
});

http.error.subscribe(function(err, response, request) {
    console.log('Sorry, there was some error with this response');
});

Extensions

Sometimes it will be better to register whole group of events and this group is called extension.

import {AbstractExtension} from 'rx-ajax/extensions';
import {Request, Response} from 'rx-ajax';

class CustomExtension extends AbstractExtension
{

	public send(request: Request): void
	{
		// todo
	}

	public afterSend(request: Request): void
	{
		// todo
	}

	public success(response: Response): void
	{
		// todo
	}

	public error(err: Error): void
	{
		// todo
	}

}

// ...

http.addExtension(new CustomExtension);

Built in extensions

Links

This extension listen for all click events on A tags with ajax class and call them via ajax.

import {Links} from 'rx-ajax/extensions';

http.addExtension(new Links);

Loading

import {Loading} from 'rx-ajax/extensions';

http.addExtension(new Loading);

Offline

This extension tests if your favicon.ico is accessible. You can change test destination by specifying Offline's constructor argument.

import {Offline} from 'rx-ajax/extensions';

http.addExtension(new Offline);

http.connected.subscribe(function() {
    alert("We're online again :-)");
});

http.disconnected.subscribe(function() {
    alert('Lost internet connection');
});

Redirect

If your server sends json data with redirect variable, then you will be redirected to address in this variable.

import {Redirect} from 'rx-ajax/extensions';

http.addExtension(new Redirect);

Snippets

If there is snippets object in response data with html id and content pairs, then this extension will iterate through this object, find element in page with given id and change content of given element into the one from response data.

import {Snippets} from 'rx-ajax/extensions';

http.addExtension(new Snippets);

Known limitations

• All non ASCII chars (eg. letters with diacritics) in file names are converted to ASCII chars before uploading.