ng2-api - npm Package Compare versions

Comparing version 0.2.5 to 0.3.0

src/api-config.ts

+import {Injectable} from '@angular/core';
+import {Headers, RequestOptions} from '@angular/http';
+
+@Injectable()
+export class ApiConfig {
+  baseUrl: string;
+  contentType: string;
+  tokenName: string;
+  authHeaderName: string;
+  authHeaderPrefix: string;
+  requestOptions: RequestOptions;
+
+  constructor(config?: any) {
+    this.baseUrl = config.baseUrl || '';
+    this.contentType = config.contentType || 'application/json';
+    this.tokenName = config.tokenName || 'token';
+    this.authHeaderName = config.authHeaderName || 'Authorization';
+    this.authHeaderPrefix = config.authHeaderPrefix || 'Bearer';
+
+    let headers: Headers = new Headers();
+    headers.set('Content-Type', this.contentType);
+    headers.set(this.authHeaderName, `${this.authHeaderPrefix} ${localStorage.getItem(this.tokenName)}`);
+    this.requestOptions = new RequestOptions({headers});
+  }
+}

src/api-http.ts

+import {Injectable} from '@angular/core';
+import {Http, Response, RequestOptions} from '@angular/http';
+import {Observable} from 'rxjs/Observable';
+import {ApiHelpers} from './api-helpers';
+import {ApiConfig} from './api-config';
+
+@Injectable()
+export class ApiHttp {
+  constructor(private apiConfig: ApiConfig,
+              private http: Http) {
+  }
+
+  url(path: string, params: any = {}): string {
+    let interpolatedPath = ApiHelpers.interpolate(path, params);
+    return `${this.apiConfig.baseUrl}/${interpolatedPath}`;
+  }
+
+  requestOptions(options?: RequestOptions): RequestOptions {
+    return this.apiConfig.requestOptions.merge(options);
+  }
+
+  get(url: string, options?: RequestOptions): Observable<Response> {
+    return this.http.get(this.url(url), this.requestOptions(options));
+  }
+
+  post(url: string, body: string, options?: RequestOptions): Observable<Response> {
+    return this.http.post(this.url(url), body, this.requestOptions(options));
+  }
+
+  put(url: string, body: string, options?: RequestOptions): Observable<Response> {
+    return this.http.put(this.url(url), body, this.requestOptions(options));
+  }
+
+  patch(url: string, body: string, options?: RequestOptions): Observable<Response> {
+    return this.http.patch(this.url(url), body, this.requestOptions(options));
+  }
+
+  delete(url: string, options?: RequestOptions): Observable<Response> {
+    return this.http.delete(this.url(url), this.requestOptions(options));
+  }
+}

package.json

 {
   "name": "ng2-api",
-  "version": "0.2.5",
+  "version": "0.3.0",
   "description": "Angular2 API services",
@@ -9,3 +9,3 @@ "main": "src/ng2-api.js",
     "clean": "rimraf typings src/*.{js,d.ts}",
-    "build": "typings install && npm run lint && tsc",
+    "build": "typings install && tsc",
     "lint": "tslint src/*.ts",
@@ -12,0 +12,0 @@ "test": "karma start",

README.md

 # ng2-api
 
-Angular2 API services, see [ng2-api-examples](https://github.com/tb/ng2-api-examples)
+Angular2 API services that wrap [Http](https://angular.io/docs/ts/latest/api/http/index/Http-class.html).
+See full client and server example [ng2-api-examples](https://github.com/tb/ng2-api-examples)
 
@@ -9,8 +10,68 @@ ## Install
 
-## Import
+## Usage
 
-    import {ApiService} from 'ng2-api';
+### auth.service.ts
 
-## Usage
+    import {provide, Injectable, NgZone} from '@angular/core';
+    import {Http, Response} from '@angular/http';
+    import {Router} from '@angular/router-deprecated';
+    import {ApiConfig, ApiHttp} from 'ng2-api';
+    
+    export function authenticated(): boolean {
+      return !!localStorage.getItem('token');
+    }
+    
+    @Injectable()
+    export class Auth {
+      user: Object;
+    
+      constructor(protected http: ApiHttp,
+                  protected zone: NgZone,
+                  protected router: Router) {
+        this.user = JSON.parse(localStorage.getItem('profile'));
+      }
+    
+      authenticated() {
+        return authenticated();
+      }
+    
+      login(params: any) {
+        return this.http.post('login', JSON.stringify(params))
+          .subscribe((res: Response) => {
+            let {token, user} = res.json();
+            localStorage.setItem('profile', JSON.stringify(user));
+            localStorage.setItem('token', token);
+            this.zone.run(() => this.user = user);
+            this.router.navigate(['/Dashboard']);
+          });
+      }
+    
+      logout() {
+        localStorage.removeItem('profile');
+        localStorage.removeItem('token');
+        this.zone.run(() => this.user = null);
+        this.router.navigate(['/Login']);
+      }
+    }
+    
+    export const AUTH_PROVIDERS: any = [
+      provide(ApiHttp, {
+        useFactory: (http: Http) => {
+          return new ApiHttp(new ApiConfig({baseUrl: 'http://localhost:8081'}), http);
+        },
+        deps: [Http]
+      }),
+      Auth
+    ];
 
+### bootstrap.ts
+
+    bootstrap(App, [
+      ...HTTP_PROVIDERS,
+      ...ROUTER_PROVIDERS,
+      ...AUTH_PROVIDERS
+    ])
+
+### posts.service.ts
+
     import {Injectable} from '@angular/core';
@@ -28,4 +89,4 @@ import {Http} from '@angular/http';
     export class PostsService extends ApiService<Post> {
-      constructor(public http: Http) {
-        super(http, 'http://localhost:8081', 'posts');
+      constructor(protected http: ApiHttp) {
+        super(http, 'posts');
       }
@@ -32,0 +93,0 @@ }

src/api-service.ts

@@ -1,24 +0,12 @@
-import {Http, Headers, Response, RequestOptions} from '@angular/http';
+import {Response, RequestOptions} from '@angular/http';
 import {Observable} from 'rxjs/Observable';
 import 'rxjs/add/operator/map';
 import {ApiHelpers} from './api-helpers';
+import {ApiHttp} from './api-http';
 
 export class ApiService<T> {
-  constructor(protected http: Http,
-              protected apiUrl: string,
+  constructor(protected http: ApiHttp,
               protected path: string) {
   }
 
-  url(path: string, params: any = {}): string {
-    let interpolatedPath = ApiHelpers.interpolate(path, params);
-    return `${this.apiUrl}/${interpolatedPath}`;
-  }
-
-  requestOptions(): RequestOptions {
-    let headers: Headers = new Headers();
-    headers.set('Content-Type', 'application/json');
-
-    return new RequestOptions({headers});
-  }
-
   serialize(model: T): string {
@@ -34,4 +22,3 @@ return JSON.stringify(model);
     return this.http.get(
-      this.url(`${this.path}/:id`, {id}),
-      this.requestOptions()
+      ApiHelpers.interpolate(`${this.path}/:id`, {id})
     ).map((res: Response) => this.deserialize(res.json()));
@@ -42,9 +29,7 @@ }
     let interpolatedPath = ApiHelpers.interpolate(this.path, search, true);
-    let requestOptions = new RequestOptions({
-      search: ApiHelpers.toSearch(search)
-    });
+    let requestOptions = new RequestOptions({search: ApiHelpers.toSearch(search)});
 
     return this.http.get(
-      this.url(interpolatedPath),
-      this.requestOptions().merge(requestOptions)
+      interpolatedPath,
+      requestOptions
     ).map((res: Response) => {
@@ -58,7 +43,4 @@ return res.json().map((item: any) => {
   create(model: T): Observable<T> {
-    return this.http.post(
-      this.url(this.path),
-      this.serialize(model),
-      this.requestOptions()
-    ).map((res: Response) => this.deserialize(res.json()));
+    return this.http.post(this.path, this.serialize(model))
+      .map((res: Response) => this.deserialize(res.json()));
   }
@@ -68,5 +50,4 @@
     return this.http.put(
-      this.url(`${this.path}/:id`, model),
-      this.serialize(model),
-      this.requestOptions()
+      ApiHelpers.interpolate(`${this.path}/:id`, model),
+      this.serialize(model)
     ).map((res: Response) => this.deserialize(res.json()));
@@ -77,6 +58,5 @@ }
     return this.http.delete(
-      this.url(`${this.path}/:id`, model),
-      this.requestOptions()
+      ApiHelpers.interpolate(`${this.path}/:id`, model)
     ).map((res: Response) => res.ok);
   }
 }

src/ng2-api.ts

@@ -0,2 +1,4 @@
+export * from './api-config';
 export * from './api-helpers';
+export * from './api-http';
 export * from './api-service';

bs-config.json

-{
-  "port": 3000,
-  "files": [
-    "./ng2-api.ts",
-    "./demo/*.*"
-  ]
-}

No alert changes

Improved metrics

Total package byte prevSize

16917

26.52%

Number of package files

15

7.14%

Lines of code

369

10.15%

Number of lines in readme file

110

124.49%

No dependency changes