Skip to content

Repository files navigation

NPM versionDependency StatusBuild Status

Donate

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';lethttp=newHttp;letdata={number: 5};letoptions={};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';lethttp=newHttp({queue: newImmediateQueue});

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';classCustomExtensionextendsAbstractExtension{publicsend(request: Request): void{// todo}publicafterSend(request: Request): void{// todo}publicsuccess(response: Response): void{// todo}publicerror(err: Error): void{// todo}}// ...http.addExtension(newCustomExtension);

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(newLinks);

Loading

import{Loading}from'rx-ajax/extensions';http.addExtension(newLoading);

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(newOffline);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(newRedirect);

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(newSnippets);

Known limitations

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

About

Simple ajax reactive library

Resources

Stars

1 star

Watchers

1 watching

Forks

Releases

Packages

Used by

Contributors

Languages