http-core-service
    TypeScript icon, indicating that this package has built-in type declarations

    1.2.2 • Public • Published

    HTTP Service

    This Angular Module allows you to have a global HTTP service. Provided are interceptors for http error handling, JWT token injection with API calls and secureCookie handle with credentails. For the hTTP Requests, a retry and next time request are added and configurable. There is also an interceptor to handle unauthorized 401, 403 errors and redirects the user to the defined setting.

    There is also a delay when a request is made before isPending$ is true - this is great for spinners that appear only when a request is taking longer then 3 seconds (soon configurable)

    Installation

    npm install http-core-service
    

    Scaffolding

    Import the module into your project under imports

    imports: [
        BrowserModule,
        AppRoutingModule,
        HttpCoreServiceModule,
      ],
    

    Use

    Define the paramiters for the settings for the HTTP Request service like the following.

    imports: [
        BrowserModule,
        AppRoutingModule,
        HttpCoreServiceModule.forRoot({
          sessionTokenName:'token',
          delayNextRequestBy: 1.5,
          requestRetries: 3,
          redirect_unauthothized: 'default',
          includeCookies: true
        }),
    ],
    

    HTTP Request settings

    SETTING TYPE Defaut Description
    sessionTokenName STRING 'token' grabs token from session for JWT Bearer token
    delayNextRequestBy NUMBER 1.5 secs if request fails, delay next request by #secs
    requestRetries NUMBER 3 number of retries before alerts user of error
    includeCookies STRING BOOLEAN adds credentails:true to headers for cookies

    Usage and Syntax

    Extend a Class with generic type - or <any[]>

    export class OnboardingMerchantService extends HttpCore<any>

    Call Super to initialize the extended class and provide the end point service path as array Inport the HTTPClient module in the contructor as _http and pass in and the REST path in super() to create an instance of the service.

    super(_http, baseUrl, ['onboarding', 'details', { size: 12 }])

    BaseURL: is the API base URL - avoid adding paths to the base URL to allow more flexability

    Paths: string[] - this provides a way to dynamically modify your paths. You may include just one path for the API such as ['onboarding/details] or manage paths indipendantly for easy reading.

    Query type - if you have a query style param that needs to be added to the path, define it as an object { size: 12 } and the request will convert to ?size=12. Encoding will also be provided. You may add multiple objects or just one object for the query.

    Then call the http method - this.getAllRecords()

    Extended Class includes the following Observables

    data$ = new BehaviorSubject<T[]>(null)
    
    isLoading$ = new BehaviorSubject<boolean>(false) // deprecated
    isSaving$ = new BehaviorSubject<boolean>(false) // deprecated
    
    isPending$ = new BehaviorSubject<boolean>(false) // replaaces both isLoading$ and isSaving$
    error$ = new BehaviorSubject<HttpError>(null)
    

    The following are the moethods avilable for HTTP request

    SETTING TYPE Defaut Description
    sessionTokenName STRING 'token' grabs token from session for JWT Bearer token
    delayNextRequestBy NUMBER 1.5 secs if request fails, delay next request by #secs
    requestRetries NUMBER 3 number of retries before alerts user of error
    includeCookies STRING BOOLEAN adds credentails:true to headers for cookies

    The better method is to create a service that you extend and call the method from it.

    To use the data$ from that servive, define an Observable in the component Observable<any[]> Then in your component Oninit bind the data this.data$ = this.service.data$ Now its available to the component.

    export class myDataService extends HttpCore<any> {
      
      myData$ = new Observable<any[]>()
    
      constructor(protected _http: HttpClient) {
        super(_http, baseUrl, ['onboarding','details'])
      }
    
      getOnboardingData() {
        this.getAllRecords()
      }
    
    }
    

    Then in the component you do the following

    constructor(private dataService: myDataService) {}
    
    onInit() {
      this.dataService.getOnboardingData()
      this.myData$ = this.dataService.data$
    }
    

    now you can do the following in your view

    <div *ngif="(myData$ | async) as data">
      {{ data.title }}
      <img [src]="data.urlImage">
    </div>
    

    Utils - Helpers

    The following utils are included for model creation and validation and other

    export { IDUtils } from './utils/id-utils'
    export { DateUtils } from './utils/date-utils'
    export { JSONValidation } from './utils/json-validation'
    

    IDUtils

    • id - generates a random id (numeric)
    • today - generates date (epoch - milliseconds)
    • randomNumber - random int
    • randomString - random string
    • RandomAlphaNumeric - random alphnumeric
    • RandomFormat - provide a mask (000-AAA-000AA) and generates alpha number in format

    DateUtils

    • currentDateTime - current time (hour, min)
    • currentDay - current day ()
    • dateToEpoch - converts date object to epoch
    • epochToDate - converts epoch to date object
    • today - date object for today
    • epochDay - epoch of today
    • calculateAge - age in epoch

    JSONValidation

    • isJSON - exhastive check if object is a valid json object
    • strict - simple check if object if json
    • isString - true/false if is a string
    • isObject - true/false if is a object

    Install

    npm i http-core-service

    DownloadsWeekly Downloads

    27

    Version

    1.2.2

    License

    ISC

    Unpacked Size

    269 kB

    Total Files

    38

    Last publish

    Collaborators

    • wavecoders