Vue-plugin-pulsar-api-service NPM

Pulsar API Service

Tiny library to make http requests and handle JWT tokens

How to install

npm install --save vue-plugin-pulsar-api-service

To add this library as a Vue plugin go to main.js/main.ts

import apiService from 'vue-plugin-pulsar-api-service';

Vue.use(apiService)

You may pass additional options to plugin method

import apiService from 'vue-plugin-pulsar-api-service';

Vue.use(apiService, { withToken: true })

Then this API will be available in your Vue app as a global property.

await this.$apiService.get(`${this.$apiService.rootUrl}/your-endpoint`)

API

Methods

Library supports http requests with following methods:

this.$apiService.get(path, setCustomHeaders)
this.$apiService.post(path, payload, setCustomHeaders)
this.$apiService.put(path, payload, setCustomHeaders)
this.$apiService.patch(path, payload, setCustomHeaders)
this.$apiService.delete(path, setCustomHeaders)

setCustomHeaders is a callback function, that accepts options object. By default, this object contains following headers:

this.headers["Accept"] = "application/json";
this.headers["Content-Type"] = "application/json";
this.headers["Cache-Control"] = "no-cache";

But, if you want to pass your own http headers to request, you need to pass setCustomHeaders callback to method. For example:

this.$apiService.get('http://localhost:3000/posts', options => {
    options.headers["Accept"] = "text/html";
    options.headers["Content-Type"] = "multipart/form-data";
    options.responseType = 'text'
})

Connection options

this.$apiService.connection

This object contains properties rootUrl and authUrl which can be used to access your root url and authentication url. These urls are found in .env.development and .env.production files in root directory of your project.

Variables to pass to .env files:

VUE_APP_ROOT_URL=www.your-host-name.com
VUE_APP_AUTH_URL=www.your-auth-url.com

AuthUrl is optional and may be skipped. If it was skipped, trying to access this.$apiService.connection.authUrl will return undefined.

rootUrl and authUrl may also be accessed directly

this.$apiService.rootUrl
this.$apiService.authUrl

JWT

this.$apiService.jwt

This object contains following methods:

this.$apiService.jwt.getIdentity() // Decodes JWT string (if it is present in localStorage) and returns object with decoded information

this.$apiService.jwt.loadToken() // Validates token and if it is absent or has expired executes getToken() method

this.$apiService.jwt.getToken() // Fetches token from server (using url in your authUrl property) and sets it in localStorage of your browser