apirequest-utils

This library help to send api request

Usage no npm install needed!

<script type="module">
  import apirequestUtils from 'https://cdn.skypack.dev/apirequest-utils';
</script>

README

Http

This library help to send api request

Predicat

Import bootstrap in your project angular in angular.json

  "styles": [
               "src/styles.css",
               "node_modules/bootstrap/dist/css/bootstrap.min.css"
             ]

or in style.css

     @import "~bootstrap/dist/css/bootstrap.min.css";

Install

npm install lib-module-modal lib-module-http

Objects

models

HttpMethod.ts

method api to send request

  export enum HttpMethod {
    GET, POST, PUT, DELETE
  }

HttpStatus.ts

status http return by api (source java spring)

  export class HttpStatus {
      public static CONTINUE = new HttpStatus(100, 'Continue');
      public static SWITCHING_PROTOCOLS = new HttpStatus(101, 'Switching Protocols');
      public static PROCESSING = new HttpStatus(102, 'Processing');
      public static CHECKPOINT = new HttpStatus(103, 'Checkpoint');
      public static OK = new HttpStatus(200, 'OK');
      public static CREATED = new HttpStatus(201, 'Created');
      public static ACCEPTED = new HttpStatus(202, 'Accepted');
      public static NON_AUTHORITATIVE_INFORMATION = new HttpStatus(203, 'Non-Authoritative Information');
      public static NO_CONTENT = new HttpStatus(204, 'No Content');
      public static RESET_CONTENT = new HttpStatus(205, 'Reset Content');
      public static PARTIAL_CONTENT = new HttpStatus(206, 'Partial Content');
      public static MULTI_STATUS = new HttpStatus(207, 'Multi-Status');
      public static ALREADY_REPORTED = new HttpStatus(208, 'Already Reported');
      public static IM_USED = new HttpStatus(226, 'IM Used');
      public static MULTIPLE_CHOICES = new HttpStatus(300, 'Multiple Choices');
      public static MOVED_PERMANENTLY = new HttpStatus(301, 'Moved Permanently');
      public static FOUND = new HttpStatus(302, 'Found');
      public static SEE_OTHER = new HttpStatus(303, 'See Other');
      public static NOT_MODIFIED = new HttpStatus(304, 'Not Modified');
      public static TEMPORARY_REDIRECT = new HttpStatus(307, 'Temporary Redirect');
      public static PERMANENT_REDIRECT = new HttpStatus(308, 'Permanent Redirect');
      public static BAD_REQUEST = new HttpStatus(400, 'Bad Request');
      public static UNAUTHORIZED = new HttpStatus(401, 'Unauthorized');
      public static PAYMENT_REQUIRED = new HttpStatus(402, 'Payment Required');
      public static FORBIDDEN = new HttpStatus(403, 'Forbidden');
      public static NOT_FOUND = new HttpStatus(404, 'Not Found');
      public static METHOD_NOT_ALLOWED = new HttpStatus(405, 'Method Not Allowed');
      public static NOT_ACCEPTABLE = new HttpStatus(406, 'Not Acceptable');
      public static PROXY_AUTHENTICATION_REQUIRED = new HttpStatus(407, 'Proxy Authentication Required');
      public static REQUEST_TIMEOUT = new HttpStatus(408, 'Request Timeout');
      public static CONFLICT = new HttpStatus(409, 'Conflict');
      public static GONE = new HttpStatus(410, 'Gone');
      public static LENGTH_REQUIRED = new HttpStatus(411, 'Length Required');
      public static PRECONDITION_FAILED = new HttpStatus(412, 'Precondition Failed');
      public static PAYLOAD_TOO_LARGE = new HttpStatus(413, 'Payload Too Large');
      public static UNSUPPORTED_MEDIA_TYPE = new HttpStatus(415, 'Unsupported Media Type');
      public static REQUESTED_RANGE_NOT_SATISFIABLE = new HttpStatus(416, 'Requested range not satisfiable');
      public static EXPECTATION_FAILED = new HttpStatus(417, 'Expectation Failed');
      public static I_AM_A_TEAPOT = new HttpStatus(418, 'I\'m a teapot');
      public static UNPROCESSABLE_ENTITY = new HttpStatus(422, 'Unprocessable Entity');
      public static LOCKED = new HttpStatus(423, 'Locked');
      public static FAILED_DEPENDENCY = new HttpStatus(424, 'Failed Dependency');
      public static UPGRADE_REQUIRED = new HttpStatus(426, 'Upgrade Required');
      public static PRECONDITION_REQUIRED = new HttpStatus(428, 'Precondition Required');
      public static TOO_MANY_REQUESTS = new HttpStatus(429, 'Too Many Requests');
      public static REQUEST_HEADER_FIELDS_TOO_LARGE = new HttpStatus(431, 'Request Header Fields Too Large');
      public static UNAVAILABLE_FOR_LEGAL_REASONS = new HttpStatus(451, 'Unavailable For Legal Reasons');
      public static INTERNAL_SERVER_ERROR = new HttpStatus(500, 'Internal Server Error');
      public static NOT_IMPLEMENTED = new HttpStatus(501, 'Not Implemented');
      public static BAD_GATEWAY = new HttpStatus(502, 'Bad Gateway');
      public static SERVICE_UNAVAILABLE = new HttpStatus(503, 'Service Unavailable');
      public static GATEWAY_TIMEOUT = new HttpStatus(504, 'Gateway Timeout');
      public static HTTP_VERSION_NOT_SUPPORTED = new HttpStatus(505, 'HTTP Version not supported');
      public static VARIANT_ALSO_NEGOTIATES = new HttpStatus(506, 'Variant Also Negotiates');
      public static INSUFFICIENT_STORAGE = new HttpStatus(507, 'Insufficient Storage');
      public static LOOP_DETECTED = new HttpStatus(508, 'Loop Detected');
      public static BANDWIDTH_LIMIT_EXCEEDED = new HttpStatus(509, 'Bandwidth Limit Exceeded');
      public static NOT_EXTENDED = new HttpStatus(510, 'Not Extended');
      public static NETWORK_AUTHENTICATION_REQUIRED = new HttpStatus(511, 'Network Authentication Required');
      public static SERVER_NOT_START = new HttpStatus(0, 'the server is not starting');
  }

HttpConfig.ts

this object is config api to use by HttpService
    - add body
    - method to send request
    - function success, error, finally
    - sendModalDefault is config to enable httpErrorModal
    - modalSend controller of modal enable while request send
export class HttpConfig {
  private Parameters: HttpParams = new HttpParams();
  public body?: string;
  public success?: (controller: any, value: any, router: Router) => void;
  public fail?: (controller: any, reason: HttpErrorResponse, router: Router) => void;
  public always?: (controller: any, router: Router) => void;
  public modalDefaultEnable: boolean;
  public modalSend: ModalController = undefined;

  constructor(public readonly method: HttpMethod,
              public readonly apis: HttpApis,
              private Url: string,
              pathParameter: any[] = []) {
    pathParameter.unshift(Url);
    this.Url = StringUtils.concatWord('/', pathParameter);
    this.modalDefaultEnable = true;
  }

  addParameter(key: string, value: string): HttpConfig {
    this.Parameters = this.Parameters.append(key, value);
    return this;
  }

  addPathParameter(...pathParameter: any[]) {
    pathParameter.unshift(this.url);
    this.Url = StringUtils.concatWord('/', pathParameter);
  }

  get parameters(): HttpParams {
    return this.Parameters;
  }

  get url(): string {
    return this.Url;
  }
}

HttpApi.ts

stock method api and url call

export class HttpApi {
  public readonly url: string = '';

  constructor(public method: HttpMethod,
              ...url: string[]) {
    this.url = StringUtils.concatWord('/', url);
  }
}

HttpApis.ts

stock all subApi request (GET,POST,...) concern one api and create HttpConfig

export class HttpApis {
  private apis = new Map();
  public header: HttpHeaders;
  constructor(private startUrlApi: string,
              private headers: HttpHeaders) {
    this.reset();
  }

  append(nameApi: string, api: HttpApi, addNameApi: boolean = true): HttpApis {
    this.apis.set(nameApi, {api: api, addNameApi: addNameApi});
    return this;
  }

  config(nameApi: string, ...pathParameter: any[]): HttpConfig | undefined {
    const apisConfig: {api: HttpApi, addNameApi: boolean} = this.apis.get(nameApi);
    if (apisConfig) {
      pathParameter.unshift(apisConfig.api.url);
      if(apisConfig.addNameApi) {
        pathParameter.unshift(nameApi);
      }
      return new HttpConfig(apisConfig.api.method, this, this.startUrlApi, pathParameter);
    }
    return undefined;
  }

  reset() {
    this.header = new HttpHeaders();
    for (const keyHeader of this.headers.keys()) {
      this.header.append(keyHeader, this.headers.get(keyHeader));
    }
  }
}

service

HttpService.ts

principal method to send request

public send<Response>(request: HttpRequest, actionResponse?: HttpActionResponse<Response>, body?: any, isEmitLoad: boolean = true) {


Example

import project dans le app.module.ts

imports: [
    BrowserModule,
    AppRoutingModule,
    ModalModule,
    HttpModule
  ]

use ApiGroup

import {ApiGroup} from './api-group';

new ApiGroup('api', 'http', 'localhost', 8080, {
    header: new HttpHeaders({
    'Access-Control-Allow-Credentials': 'true',
  })
}, true)
  .append('nameApi', HttpMethod.GET) // send http://localhost:8080/api/nameApi
  .append('test', HttpMethod.PUT)
  .append('launch', HttpMethod.POST, false) // send http://localhost:8080/api
  .append('methodPut', HttpMethod.PUT, false)

Best practice for ApiGroup implement

put ApiGroup in file environment.ts

import {ApiGroup} from './api-group';

const apiUrl = 'http://localhost:8080/';
const apiGameHeader = new HttpHeaders({
  'Access-Control-Allow-Credentials': 'true',
});
const api = new ApiGroup('api', 'http', 'localhost', 8080, {
    header: apiHeader
}, true)
  .append('nameApi', HttpMethod.GET) // send http://localhost:8080/api/nameApi
  .append('test', HttpMethod.PUT)
  .append('launch', HttpMethod.POST, false) // send http://localhost:8080/api
  .append('methodPut', HttpMethod.PUT, false)

export const environment = {
  production: true,
  apis: {
    api: api
  }
}



In container use HttpApis and HttpService

export class Component implements OnInit {
  private environment = environment;
  public launchStatus: boolean;

  constructor(private httpService: HttpService,
              private router: Router) {
  }

  get clickTest() {
    const apiTest = this.environment.apis.api.getHttpRequest('test')
    this.httpService.send(apiTest, {
        success: data => alert('success'),
        error: reason => alert(JSON.stringify(reason)),
        complete: () => alert('complete')
    });
  }

  public clickLaunch(body: body) {
     const apiLaunch = this.environment.apis.api.config('launch')
     this.httpService.send(apiTest, {
         success: data => this.launchStatus = true
     }, body);
  }
  }