vue-jwt-mongo

A package for bootstrapping a simple JSON Web Token-based authentication system using Vue.js, MongoDB and Express.js.

Installation

npm install vue-jwt-mongo --save

Server

const app = require('express')()

const vjmServer = require('vue-jwt-mongo').Server({
  mongoUrl: 'mongodb://localhost/db',
  jwtSecret: 'shhh'
})

Options

• mongoUrl (mandatory): an address of the Mongo database.
  • See mongoose.createConnection for details.
• jwtSecret (mandatory): a secret key for token generation.
  • One can get such a key here.
  • See jsonwebtoken.sign for details.
• userModelName: a name for the mongoose model storing encoded user credentials.
  • Defaults to 'User'.
• jwtExpiresIn: token expiration time in seconds.
  • Defaults to 7 * 24 * 60 * 60 (one week).
  • See jsonwebtoken.sign for details.

Endpoints

registerHandler

Expects { username, password } in the request body. Returns an empty response.

The password is salted and hashed via passport-local-mongoose.

app.post('/auth/register', vjmServer.registerHandler)

loginHandler

Expects { username, password } in the request body. Returns a string — the token.

app.post('/auth/login', vjmServer.loginHandler)

refreshHandler

Expects an empty request body and Authorization: Bearer {token} as one of the HTTP headers. Returns a string with a new token if the original token is valid.

app.post('/auth/refresh', vjmServer.refreshHandler)

Protector

jwtProtector ensures that the incoming request has a valid token. Expects Authorization: Bearer {token} as one of the HTTP headers.

app.get('/protected', vjmServer.jwtProtector, (request, response) => {
    console.log(request.user.username)
})

Client

Vue.use(require('vue-resource'))
Vue.use(require('vue-jwt-mongo').Client, {
  /* options, if any */
})

Options

• registerEndpoint: the server's endpoint for registration requests.
  • Defaults to '/auth/register'.
• loginEndpoint: the server's endpoint for authentication requests.
  • Defaults to '/auth/login'.
• refreshEndpoint: the server's endpoint for refreshing the token.
  • Defaults to '/auth/refresh'.
• storageKey: a localStorage key used for saving the token.
  • Defaults to 'jsonwebtoken'.
• bearerLexem: a lexem prepending tokens in Authorization headers.
  • Defaults to 'Bearer ' (extra space intended).

Requests

Authentication

All of the following requests return vue-resource Promises, so one can get an idea of the callback structure here.

this.$auth.register('login', 'password')

this.$auth.logIn('login', 'password')

this.$auth.refresh()

Authorization

If bearer: true is passed then Authorization: Bearer {token} is added as a header.

this.$http.get('/protected', { bearer: true }).then(response => {
    console.log(response)
})

Token

isLoggedIn

Returns true if the saved token is valid and false otherwise.

let isLoggedIn = this.$auth.isLoggedIn()

getToken

Returns a string if the saved token is valid and null otherwise.

this.$auth.getToken()

logOut

Purges the saved token.

this.$auth.logOut()