vuejs Authentication – vue sessionstorage and localstorage

vuejs Authentication – vue sessionstorage and localstorage

Vuejs Session All Method

• this.$session.getAll() , In vuejs Functions,returns all Simple data stored in the Vuejs Session.
• this.$session.set(key,value), sets a single Simple value to the Vuejs Session.
• this.$session.get(key),returns the value Simple attributed to the given key.
• this.$session.start() , In vuejs Functions, initializes a Vuejs session with a ‘session-id’. If you attempt to save a Simple value without having started a new Vuejs session, the simple plugin will Simple automatically start a new Vuejs session.
• this.$session.exists() , In vuejs Functions,checks whether a Vuejs session has been simple initialized or not.
• this.$session.has(key),checks whether the simple key exists in the Vuejs Session
• this.$session.remove(key),removes the given simple key from the Session
• this.$session.clear() , In vuejs Functions, clear all keys in the Vuejs Session, except for ‘session-id’, simple keeping the Vuejs Session alive
• this.$session.destroy() , In vuejs Functions, destroys the Vuejs Session
• this.$session.id() , In vuejs Functions,returns the Simple ‘session-id’

vuejs state management Example

here in this example show you localstorage,sessionStorage and cookies in javascript and then retrieve web services.

	// init param
	export default {
    name: 'login',
	//call this method login function
    methods: {
        login: function () {
          this.$http.post('https://infinityknow.com/user/login', {
            password: this.password, // set password
            email: this.email // set email address
          }).then(function (response) {
		  // check conditions
            if (response.status === 200 && 'token' in response.body) {
              this.$session.start() // start the session
              this.$session.set('jwt', response.body.token)
			  // Bearer token get and pass router
              Vue.http.headers.common['Authorization'] = 'Bearer ' + response.body.token
              this.$router.push('/panel/search')
            }
          }, function (err) {
            console.log('err', err)
          })
        }
    }
}

Vuejs Logout Method Calling

export default {
//init name all
  name: 'panel',
  data () {
    return { }
  },
  //call the function
  beforeCreate: function () {
    if (!this.$session.exists()) { // check conditions
      this.$router.push('/')
    }
  },
  //call this method logout
  methods: {
    logout: function () {
      this.$session.destroy()//session destroy here
      this.$router.push('/') // router using vuejs
    }
  }
}

Example