Connessione Progetto ANGULAR/SPRING-REST a DB MYSQL

di il
4 risposte

Connessione Progetto ANGULAR/SPRING-REST a DB MYSQL

Buongiorno,
ho un problema con un progetto di ANGULAR (FRONT-END) e SPRING-REST (BACK-END)
Il programma è collegato ad un DATABASE. Quando provo ad effettuare il LOGIN (con le credenziali inserite nella tabella presente nel DB), direttamente nella home page del sito, il programma non mi mostra la pagina di benvenuto (implementata correttamente). Penso sia un problema dovuto ad un mancato collegamento con il DB. Eppure nel file application.properties è specificato lo stesso numero di porta presente nel DB
PS: Sto usando VISUAL STUDIO CODE

4 Risposte

  • Re: Connessione Progetto ANGULAR/SPRING-REST a DB MYSQL

    Maurizio93 ha scritto:


    Quando provo ad effettuare il LOGIN (con le credenziali inserite nella tabella presente nel DB), direttamente nella home page del sito, il programma non mi mostra la pagina di benvenuto (implementata correttamente). Penso sia un problema dovuto ad un mancato collegamento con il DB. Eppure nel file application.properties è specificato lo stesso numero di porta presente nel DB
    Come facciamo a sapere qual è il problema se non spieghi cosa accade?

    Cosa succede quando fai il login? Che errore appare, se appare? E nella console di sviluppo del browser cosa viene visualizzato? Come è implementato il login?

    Se non dai indizi né mostri codice, a meno di non possedere una sfera di cristallo, non è possibile dirti cosa c'è che non va.

    Ciao!
  • Re: Connessione Progetto ANGULAR/SPRING-REST a DB MYSQL

    Hai perfettamente ragione. Sono stato molto generico Quando effettuo il login, non accade assolutamente nulla. Non viene visualizzato alcun errore. È come se il click del mouse non fosse collegato ad alcun metodo (anche se in realtà lo è). Non ho mostrato il codice perché troppo lungo. Ora provo a farlo. Inizialmente il JDBC non era presente. Poi l'ho scaricato e l'ho copiato nella cartella del progetto

    login.component.html
    
    <body>
    <div class="container-fluid">
      <div class="row">
        <div class="col-md-7">
          <img src="../../assets/operas_logo.svg" alt="logo">
        </div>
        
        <div class="col-md-5">
          <form #f="ngForm">
            <p>Please insert username and password to Login or Sign Up</p>
            <div class="form-group">
              <input class="form-control" type="text" id="user" name="username" placeholder="Username" ngModel>
            </div>
            <div class="form-group">
              <input class="form-control" type="password" id="pass" name="password" placeholder="Password" ngModel>
            </div>
            <button type="submit" (click)="login(f)">Login</button>
            <button type="submit">Sign Up</button>
          </form>
        </div>
      </div>
    </div>
    </body>
    
    login.component.ts
    
    import { Component, OnInit } from '@angular/core';
    import { LoginDTO } from 'src/dto/logindto';
    import { NgForm } from '@angular/forms';
    import { UserService } from 'src/service/user.service';
    import { Router } from '@angular/router';
    
    @Component({
      selector: 'app-login',
      templateUrl: './login.component.html',
      styleUrls: ['./login.component.css']
    })
    export class LoginComponent implements OnInit {
    
      loginDTO: LoginDTO;
    
      constructor(private service: UserService, private router: Router) { }
    
      ngOnInit() {
      }
    
      login(f: NgForm): void {
        this.loginDTO = new LoginDTO(f.value.username, f.value.password);
    
        this.service.login(this.loginDTO).subscribe((user) => {
    
          if (user != null) {
            localStorage.setItem('currentUser', JSON.stringify(user));
    
            switch (user.usertype.toString()) {
              case 'ADMIN': {
                this.router.navigate(['/admin-dashboard']);
                break;
              }
              case 'USER': {
                this.router.navigate(['/user-dashboard']);
                break;
              }
              default:
                this.router.navigate(['/login']);
            }
          }
        });
      }
    }
    
    admin-dashboard.component.html
    
    <div class= "container">
      <h1 style="text-align: center">Welcome {{user.username}}</h1>
      <p>
    	Hello World!!!
      </p>
    </div>
    
    admin-dashboard.component.html
    
    import { Component, OnInit } from '@angular/core';
    import { UserDTO } from 'src/dto/userdto';
    
    /**
     * Componente della dashboard admin. Nell'ngOnInit recupera
     * l'utente loggato per il messaggio di benvenuto.
     */
    @Component({
      selector: 'app-admin-dashboard',
      templateUrl: './admin-dashboard.component.html',
      styleUrls: ['./admin-dashboard.component.css']
    })
    export class AdminDashboardComponent implements OnInit {
    
      user: UserDTO;
    
      constructor() { }
    
      ngOnInit() {
        this.user = JSON.parse(localStorage.getItem('currentUser'));
      }
    
    }
    
  • Re: Connessione Progetto ANGULAR/SPRING-REST a DB MYSQL

    Maurizio93 ha scritto:


    Quando effettuo il login, non accade assolutamente nulla.
    E' abbastanza improbabile che non vi sia alcuna segnalazione di errore, a meno che il clic non sia appunto ignorato.
    Magari non è una segnalazione che appare nella pagina, ma se Angular non riesce a fare qualcosa per via di un problema, l'errore viene quasi sempre indicato nella Console, e in modo pure dettagliato (nella maggior parte dei casi).

    Maurizio93 ha scritto:


    Non viene visualizzato alcun errore.
    Ma hai controllato nella scheda della Console all'interno dei Developer Tools del browser?
    Per intenderci, quelli accessibili con il tasto F12?
  • Re: Connessione Progetto ANGULAR/SPRING-REST a DB MYSQL

    No, in realtà non ho controllato. Comunque ho risolto grazie al mio TEAM. Il problema era relativo all'inclusione di un DATABASE non aggiornato. Ti ringrazio comunque
Devi accedere o registrarti per scrivere nel forum
4 risposte