5
respostas

header não muda

Só aparece o link de login, mesmo após estar logado nao muda para o link com o nome de usuário, nao exibe erro nem nada, apenas não muda o link de login. Quando eu tiro o else do login ele aparece o logout mas com o usuario em branco.

5 respostas

Olá Leonardo, tudo bem?

Compartilha seu código de template e ts do cabecalho para a gente entender melhor o que está acontecendo.

Aguardo.


<header class="sticky-top">
  <nav class="navbar navbar-light bg-white">
    <a class="navbar-brand">Cadastro</a>
    <div *ngIf="user$ | async as user">
      <div *ngIf="user.email; else login">
        <i class="fa fa-user-circle mr-1"></i>
        <a class="mr-1">{{ user.email }}</a>
        <a (click)="logout()">Logout</a>
      </div>
    </div>
  </nav>
  <ng-template #login>
    <span class="navbar-text">
      <a [routerLink]="['']">Login</a>
    </span>
  </ng-template>
</header>


import { Component } from '@angular/core';
import { Router } from '@angular/router';
import { UsuarioService } from './../../autenticacao/usuario/usuario.service';

@Component({
  selector: 'app-cabecalho',
  templateUrl: './cabecalho.component.html',
  styleUrls: ['./cabecalho.component.css'],
})
export class CabecalhoComponent {

  user$ = this.usuarioService.retornaUsuario();

  constructor(
    private usuarioService: UsuarioService,
    private router: Router,
    ) {}

  logout() {
    this.usuarioService.logout();
    this.router.navigate(['']);
  }
}

Estou usando utilizando um projeto SPRINGBOOT no back end que passa o token seguindo os passos do curso de Spring aqui da alura.

Olá Leonardo.

No template você quer exibir o nome do usuário, mas está solicitando o email. Faz essa alteração abaixo para resolver essa questão.

<div *ngIf="user$ | async as user">
      <div *ngIf="user.email; else login">
        <i class="fa fa-user-circle mr-1"></i>
        <a class="mr-1">{{ user.name }}</a>
        <a (click)="logout()">Logout</a>
      </div>
    </div>

Se não exibir, é possível que tenha algo de errado na função que retorna o usuário. Ai você compartilha o usuarioService para que a gente possa te ajudar.

Bons estudos.

Essa foi uma alteração que fiz, pq eu passo email e senha na aplicação do spring, por isso o user.email. Minha intenção não é mostrar o usuário, apenas quero esconder o header na página de login

No projeto que segui os passos do professor e baixei a api disponibilizada por ele esta funcionando tudo certo, tive a ideia de rodar o projeto que criei no sozinho na api que o professor disponibilizou e funcionou tudo certo, o que me fez pensar que o problema está na minha api que retorna o token conforme o curso (https://cursos.alura.com.br/course/spring-boot-seguranca-cache-monitoramento): Alguma ideia do que possa ser?

package br.com.angularrest.angularrest.controller;

import javax.validation.Valid;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Profile;
import org.springframework.http.HttpHeaders;
import org.springframework.http.HttpStatus;
import org.springframework.http.ResponseEntity;
import org.springframework.security.authentication.AuthenticationManager;
import org.springframework.security.authentication.UsernamePasswordAuthenticationToken;
import org.springframework.security.core.Authentication;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import br.com.angularrest.angularrest.model.LoginForm;
import br.com.angularrest.angularrest.security.TokenDto;
import br.com.angularrest.angularrest.security.TokenService;

@RestController
@RequestMapping("/auth")
public class AutenticacaoController {

    @Autowired
    private AuthenticationManager authmanager;

    @Autowired
    private TokenService tokenService;

    @PostMapping
    public ResponseEntity<TokenDto> autenticar(@RequestBody @Valid LoginForm form){
        UsernamePasswordAuthenticationToken dadosLogin = form.converter();
        try {
            Authentication authentication = authmanager.authenticate(dadosLogin);
            String token = tokenService.gerarToken(authentication);
            HttpHeaders headers = new HttpHeaders();
            headers.add("x-access-token", token);

            return new ResponseEntity<TokenDto>(new TokenDto(token, "Bearer"), headers, HttpStatus.OK);
        } catch (Exception e) {
            return ResponseEntity.badRequest().build();
        }

    }

}