GithubHelp home page GithubHelp logo

danielkucal / http-rest-decorator Goto Github PK

View Code? Open in Web Editor NEW

This project forked from alexey-gladilin/http-rest-decorator

0.0 1.0 0.0 1.57 MB

This library allows to interact with rest api in angular app.

License: MIT License

JavaScript 4.71% TypeScript 84.87% HTML 3.71% CSS 6.71%

http-rest-decorator's Introduction

http-rest-decorator

GitHub license NPM version


This library allows to interact with rest api in your angular app.

Features

  • Http methods: GET, POST, PUT, DELETE, HEAD;
  • Async or sync request;
  • Use of a mockup to emulate working with a webApi server;
  • Use adapters to transform response data received from the webApi or to prepare data to be sent to the server
  • Flexible configuration for setting

Changelog

    Check out the changelog to check all the latest changes.

List of decorators

Class level

  • BaseUrl - (webApi url host)
  • DefaultHeaders - (default request header for each method HttpService)

Methods level

  • GET, POST, POST_SYNC, PUT, DELETE, HEAD - (request method)
  • Headers - (request header)
  • Produces - (determines what type of data the method can send)
  • Adapter - (functions to be called for data transformation)
  • Mockup - (mockup data generation)

Parameters level

  • Path - (variables are passed in url)
  • Query - (parameter values to determine the type of serialization of the contents of the request/response MIME type 'application/x-www-form-urlencoded')
  • Body - (body REST method)

Installation

npm install http-rest-decorator

Usage

Configuration

You can configure services to work with the Web Api in several ways

*WebApi services must be declared in the module in the "providers" section instead (@Injectable({ providedIn: 'root' }) otherwise it will not work)

  1. default configuration for all services (in *.module.ts)
import {
  HTTP_CONFIG,
  HttpConfig
} from 'http-rest-decorator';

/**
 * default http service configuration settings
 */
export const DEFAULT_HTTP_CONFIG: HttpConfig = {
  Url: 'api.heroes.com',
  Headers: {
    'Accept': 'application/json',
    'Content-Type': 'application/json',
    'DataType': 'application/json'
  }
};

/**
 * main module application
 */
@NgModule({
  ...
  providers: [
    { provide: HTTP_CONFIG, useValue: DEFAULT_HTTP_CONFIG },
    HeroWebApi
  ]
  ...
})
export class AppModule { }
  1. Individual service configuration
/**
 * http service of communication with webApi in the context of heroes
 */
@Injectable()
@BaseUrl('http://mysite.com/api/hero')
@DefaultHeaders({
  'Accept': 'application/json',
  'Content-Type': 'application/json'
})
export class HeroWebApi extends HttpService {
}

*DefaultHeader decorator optional

An example of declaring methods to access the webApi

  /**
   * returns a list of heroes.
   * test data is used.
   * if you remove the decorator Mockup, the call will be made
   * to web Api via http Protocol
   */
  @GET()
  @Mockup(HeroMockup.getHeroes)
  getHeroes(): Observable<Hero[]> { return null; }

  /**
   * returns the hero
   * @param id the ID of the hero
   */
  @GET('{id}')
  getHero(@Path('id') id: number): Observable<Hero> { return null; }

  /**
   * saves the data of the hero
   * @param request data to update
   */
  @POST()
  updateHero(@Body('request') request: Hero): Observable<Hero> { return null; }

Example of using a data transformation adapter

@GET()
@Adapter({
  response: [{
    fn: HeroAdapter.getHeroesTransform
  }]
})
getHeroes(): Observable<Hero[]> { return null; }

Data transformation methods can be called both after receiving data from the web Api and before sending it to the server.

http-rest-decorator's People

Contributors

alexey-gladilin avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.