Inicio » Cursos » ReactJS y Laravel Directorio de Empresas

Curso ReactJS y Laravel Directorio de Empresas

Capitulo 17 ➜ Logout de usuarios

Logout de usuarios

Logout de usuarios en React JS

Logout de un usuario con el Rol Admin y Client en React JS

Logout de un usuario con el Rol Admin y Client en React JS

 

Config.jsx

getLogout:(data)=>axios.post(`${base_api_url}/auth/logout`,data)

 

bootstrap.js


import axios from 'axios';
window.axios = axios;
axios.defaults.withCredentials = true;
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

 

Navbar.jsx

import React from 'react'
import AuthUser from '../pageauth/AuthUser'
import Config from '../Config'

const Navbar = () => {

  const {getRol,getLogout, getToken} = AuthUser()

  const logoutUser =()=>{
    Config.getLogout('/logout')
    .then(response=>{      
      getLogout()
    }).catch(error => {
      console.error(error);
    })
  }

  const renderLinks = () =>{
    if(getToken()){
      return(
        <>
        <li className="nav-item">
          <a className="nav-link" href={`/${getRol()}`}>Administración</a>
        </li>
        <li className="nav-item">
          <a className="nav-link" href="#" onClick={logoutUser}>Logout</a>
        </li>
        </>
      )
    }else{
      return(
        <>
        <li className="nav-item">
          <a className="nav-link" href="/login" >Login</a>
        </li>
        </>
      )
    }
  }


  return (
    <nav className="navbar navbar-expand-lg bg-body-tertiary">
  <div className="container-fluid">
    <a className="navbar-brand" href="/">DIREMP</a>
    <button className="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
      <span className="navbar-toggler-icon"></span>
    </button>
    <div className="collapse navbar-collapse" id="navbarNav">
      <ul className="navbar-nav">
        <li className="nav-item">
          <a className="nav-link active" aria-current="page" href="/">Home</a>
        </li>
        <li className="nav-item">
          <a className="nav-link" href="/categorias">Categorias</a>
        </li>
        { renderLinks()}
      </ul>
    </div>
  </div>
</nav>
  )
}
export default Navbar

 

En kernel.php

'api' => [
            \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
            \Illuminate\Routing\Middleware\ThrottleRequests::class.':api',
            \Illuminate\Routing\Middleware\SubstituteBindings::class,
        ],

 

 


702 visitas

Sigue con el curso: Capítulo 18 – PanelAdmin

Descarga el código del proyecto

Descarga el código fuente del proyecto adquiriendo el curso completo

Comprar

Más cursos que pueden interesarte

Más cursos

Codea Codea App

México, Colombia, España, Venezuela, Argentina, Bolivia, Perú

© Todos los derechos reservados Codea App | ...de frente al código!!! | 2020 - 2023