rxcomp-http

💎 RxComp HttpModule

RxComp Http is the Http module for RxComp, developed with RxJs.

lib & dependancy	size
rxcomp-http.min.js
rxcomp-http.min.js
rxcomp.min.js
rxcomp.min.js
rxjs.min.js
rxjs.min.js

RxComp Http Demo
RxComp Http Api

---

Installation and Usage

ES6 via npm

This library depend on RxComp and RxJs
install via npm or include via script

npm install rxjs rxcomp rxcomp-http --save

---

CDN

For CDN, you can use unpkg

<script src="https://unpkg.com/rxjs@6.6.2/bundles/rxjs.umd.min.js" crossorigin="anonymous" SameSite="none Secure"></script>
<script src="https://unpkg.com/rxcomp@1.0.0-beta.19/dist/umd/rxcomp.min.js" crossorigin="anonymous" SameSite="none Secure"></script>  
<script src="https://unpkg.com/rxcomp-http@1.0.0-beta.19/dist/umd/rxcomp-http.min.js" crossorigin="anonymous" SameSite="none Secure"></script>  

The global namespace for RxComp is rxcomp

import { CoreModule, Module } from 'rxcomp';

The global namespace for RxComp HttpModule is rxcomp.http

import { HttpModule } from 'rxcomp-http';

---

Bootstrapping Module

import { Browser, CoreModule, Module } from 'rxcomp';
import { HttpModule } from 'rxcomp-http';
import AppComponent from './app.component';

export default class AppModule extends Module {}

AppModule.meta = {
    imports: [
        CoreModule,
        HttpModule,
    ],
    declarations: [],
    bootstrap: AppComponent,
};

Browser.bootstrap(AppModule);

---

HttpService

Import HttpService and call any CRUD method as Observable.

import { HttpService } from 'rxcomp-http';

HttpService.get$<IResponseData>(methodUrl).pipe(
  first(),
).subscribe((response: IResponseData) => {
  this.items = response.data.getTodos;
  this.pushChanges();
}, error => console.log);

---

Interceptors

You can create your custom interceptors implementing IHttpInterceptors.

import { IHttpInterceptor } from 'rxcomp-http';

export class CustomRequestInterceptor implements IHttpInterceptor {
    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        if (shouldCancelRequest) {
            return EMPTY;
        }
    		return next.handle(request);
    }
}

export class CustomResponseInterceptor implements IHttpInterceptor {
    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        return next.handle(request).pipe(
            tap(event => {
                if (event instanceof HttpResponse) {
                    console.log('CustomResponseInterceptor.status', event.status);
                    console.log('CustomResponseInterceptor.filter', request.params.get('filter'));
                }
            })
        );
    }
}

Add your custom interceptors in the AppModule.

AppModule.meta = {
    imports: [
        CoreModule,
        HttpModule.useInterceptors([
          CustomRequestInterceptor, 
          CustomResponseInterceptor
        ]),
    ],
    declarations: [],
    bootstrap: AppComponent,
};

---

Browser Compatibility

RxComp supports all browsers that are ES5-compliant (IE8 and below are not supported).

---

Contributing

Pull requests are welcome and please submit bugs 🐞

---

Install packages

npm install

---

Build, Serve & Watch

gulp

---

Build Dist

gulp build --target dist

---

Thank you for taking the time to provide feedback and review. This feedback is appreciated and very helpful 🌈

• Github Project Page

If you find it helpful, feel free to contribute in keeping this library up to date via PayPal

---

Contact

• Luca Zampetti [e-mail]
• Follow @actarian on Twitter

---

Release Notes

Changelog here.