@antcde/connect-ts v0.3.4

ANTCONNECT TS/JS

With this package you can give your applications simple access to the ANT api

install npm package

npm install axios

axios is needed and not included in the package itself

npm install ant_tsconnect

this will give you access to the AntConnect class which needs a httpClient (see below)

httpclient

to connect to one of ANT's environments you need a httpclient where you set the following properties

• client_id
• client_secret
• base_url
• api_url
• this client you will pass on to AntConnect, and you can connect to the given api

const httpClient = new CustomHttpClient('http://api-antcde.io', '/api/1.0', 'X', 'SECRET')
const antConnect = newAntConnect(httpClient)

Authentication

to authenticate an user you can access the authenticate method by the following

antConnect.httpClient.authenticate({
  username: 'user@antcde.io',
  password: 'password'
})

you can save the access token to localstorage or a cookie and add it with the custom interceptors to each request (see below)

two-factor authorization (2fa)

if 2fa is enabled for the user you will receive error response with data

{ code: 1707747196 }

in

antConnect.users.getAuthenticatedUser()

In that case the best way is handling this error in custom interceptor by the error code and verify your login token with the prepared request from antConnect

antConnect.users.verifyTwoFactor({ code })

interceptors

it is possible to create custom request and response interceptors.

you can create a custom class with the following functions:

// Custom request interceptor
export function requestInterceptor(config) {
  config.headers = {}

  config.headers['Authorization'] = 'Bearer Client'
  return config
}

// Custom response interceptor
export function responseInterceptor(response) {
  // Modify the response as needed
  // For example, you can extract specific data or handle errors
  return response
}

then you can add these interceptors to the httpclient

import { requestInterceptor } from '@/interceptors' // import

const httpClient = new CustomHttpClient(
  'http://192.168.1.50:8000',
  '/api/1.0',
  '2',
  'OEQWm6a4rsbqTSEiB2y32O2yR0J3MFlUPbZJWI9w'
)
httpClient.addRequestInterceptor(requestInterceptor) // add here
const antConnect = newAntConnect(httpClient)

create single instance

Depending on your framework there are multiple ways to create a single instance of AntConnect across your whole application

Vue (3)

// TODO change this

const httpClient = new CustomHttpClient(
  'http://192.168.1.50:8000',
  '/api/1.0',
  '2',
  'OEQWm6a4rsbqTSEiB2y32O2yR0J3MFlUPbZJWI9w'
)
httpClient.addRequestInterceptor(requestInterceptor)
const antConnect = newAntConnect(httpClient)

app.provide('antConnect', antConnect) // here we provide the instance to the whole application

and by injection in our vue components we can access the instance like this:

const antConnect = inject('antConnect')
let projects = await antConnect.projects.getProjects()

in the above example we fetch the projects of a given user.

As we have an idea to move all projects to monorepo, maybe will be better to move to pnpm packager