jin-frame

Reusable HTTP request definition library. Ok, Create template for Your HTTP Request!

Axios Usage	Jin-Frame

Why jin-frame?

When the system designed by MSA architecture, it invokes many APIs repeatedly. These repetitive API calls can be optimized for method extraction by refectoring, but are hardly reusabled and easily make to mistakes. Jin-frame defines the API as a class. Defining APIs in this class allows static type verification with the help of the TypeScript compiler and reduces the probability of errors by abstracting API calls. Jin-frame can use Axios to call APIs directly or automatically process up to run.

1. TypeScript compiler can detect error at compile-time
2. HTTP request definition
3. Use Axios ecosystem
4. Inheritance
5. Support FileUpload

Requirement

1. TypeScript
2. Decorator
   • enable experimentalDecorators, emitDecoratorMetadata option in tsconfig.json

Axios version

jin-frame	axios
2.x	<= 0.27.x
3.x	>= 1.1.x

Install

npm i jin-frame --save

Useage

class TestPostQuery extends JinFrame {
  @JinFrame.param()
  public readonly id: number;

  @JinFrame.body({ replaceAt: 'test.hello.marvel.name' })
  public readonly name: string;

  @JinFrame.header({ replaceAt: 'test.hello.marvel.skill' })
  public readonly skill: string;

  @JinFrame.body({ replaceAt: 'test.hello.marvel.gender' })
  public readonly gender: string;

  constructor(args: OmitConstructorType<TestPostQuery, 'host' | 'method' | 'contentType'>) {
    super({ host: 'http://some.api.yanolja.com/jinframe/:id', method: 'POST', ...args });
  }
}

TestPostQuery class create AxiosRequestConfig object below.

const query = new TestPostQuery('ironman', 'beam');
console.log(query.request());

// console.log show below,
{
  timeout: 2000,
  headers: { test: { hello: { marvel: { skill: 'beam' } } }, 'Content-Type': 'application/json' },
  method: 'POST',
  data: { test: { hello: { marvel: { name: 'ironman', gender: 'male' } } } },
  transformRequest: undefined,
  url: 'http://some.api.yanolja.com/jinframe/1',
  validateStatus: () => true
}

You can change name or skill parameter at run-time. Even if you can change host address. Every change don't make fail and create well-formed AxiosRequestConfig object. Also you can change request time and transformRequest, validateStatus parameter. x-www-form-urlencoded transformRequest already include. You only set content-type params. See x-www-form-urlencoded testcase.

Execution no need additional progress. Create curried function after execute that function. jin-frame using axios library so using on browser.

const query = new TestPostQuery('ironman', 'beam');
const res = await query.execute();

// or
const resp = await axios.request(query.request());

Also you can use either,

// change base calss JinFrame to JinEitherFrame
class TestPostQuery extends JinEitherFrame {
  // your definition ...
}

const query = new TestPostQuery('ironman', 'beam');
const res = await query.execute();

if (isFail(res)) {
  // failover action
}

Form

The form data is multipart/form-data and application/x-www-form-urlencoded. Use to upload files or submit form fields data.

application/x-www-form-urlencoded

application/x-www-form-urlencoded converts from data using the trasformRequest function in axios. For jin-frame, if you set the application/x-www-form-urlencoded to content-type, use the built-in transformRequest function or pass transformRequest function to constructor.

multipart/form-data

jin-frame uses the form-data package for form-data processing. If you set the multipart/form-data content-type, use the form-data package to generate the AxiosRequestConfig data field value. Alternatively, upload the file by passing the customBody constructor parameter.

Example

You can find more examples in examples directory.