react-hapi-jwt-auth

Login using JWT. A react component that uses the api from hapi-jwt-couch

Usage no npm install needed!

<script type="module">
  import reactHapiJwtAuth from 'https://cdn.skypack.dev/react-hapi-jwt-auth';
</script>

README

react-hapi-jwt-auth

Login using JWT components

NPM JavaScript Style Guide

Install

npm install --save react-hapi-jwt-auth

Usage

import React, { Component } from 'react'
import { Route, Router } from 'react-router-dom';

import axios from 'axios';//For http requests


import {JWTAuth, JWTAuthInterceptor, JWTAuthUsers, JWTAuthProfile, JWTAuthService} from 'react-hapi-jwt-auth';


class Example extends Component {

    constructor(props){
        super(props);

        let http = axios;

        this.state = {
          user: {},
          showLogin: true
        }

        const self = this;

        //Every request that is done by axios is intercepted and the auth json web token (JWT)) is included
        const interceptor = new JWTAuthInterceptor();
        interceptor.setHttp(http);
        interceptor.update();
        
        //The service allows to get the authenticated user information
        const jwtauth = new JWTAuthService();
        jwtauth.setHttp(http);
        jwtauth.getUser()
        .then(function(user){
          console.log(user);
        });
    }

    //View user profile
    profile(){
        return (<JWTAuthProfile/>);
    }

    //Admin view for all the users
    adminUsers(){
        return (<JWTAuthUsers/>);
    }

    //Show login and create user form
    login(){
        return (</JWTAuth>);
    }

    render () {
        return (
            <Router>
                <Route path="/login" component={this.login.bind(this)}/>
                <Route path="/user" component={this.profile.bind(this)}/>
                <Route path="/admin/users" component={this.adminUsers.bind(this)}/>
            </Router>
        )
    }
}

License

MIT © juanprietob