Discussion :

[thorgal1612]

Bonjour,

Je me suis inspiré de ce tuto pour faire ma page de login.
J'exécute un WS du backend qui doit me retourné un token

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
login(username: string, password: string) {
    return this.http.post<any>('http://localhost:8000/Unify/API/api-token-auth/', { username: username, password: password })
      .map(user => {
        // login successful if there's a jwt token in the response
        if (user && user.token) {
          console.log('connexion');
          // store user details and jwt token in local storage to keep user logged in between page refreshes
          localStorage.setItem('currentUser', JSON.stringify(user));
        }
 
        return user;
      });

Ma méthode 'login' est bien appelé (j'ai mis une trace pour m'en assurer) mais quand je regarde les requêtes qui passent via Mozilla, je ne vois pas ma requête de backend (ni le message 'connexion' dans la log).

J'ai essayé mon WS de manière unitaire, il fonctionne bien.

Si vous pouvez m'aider.

A+

[Marco46]

Probablement un problème de config CORS sur le backend qui fait que le navigateur ne laisse pas partir ta requête.

Sur quelle url est servie ton front ?

[thorgal1612]

J'ai paramétré mon backend comme ceci

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
CORS_ORIGIN_WHITELIST = (
    'localhost:4200',
    'localhost:3000'
)

j'ai déjà des requête mais en GET qui passent.

Merci pour ta réponse, je viens de voir qu'il y a un paramétrage pour indiqué le type de requête, je vais essayer

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
CORS_ALLOW_METHODS = (
    'DELETE',
    'GET',
    'OPTIONS',
    'PATCH',
    'POST',
    'PUT',
)

[thorgal1612]

J'ai ajouté ceci

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
CORS_ALLOW_METHODS = (
    'DELETE',
    'GET',
    'OPTIONS',
    'POST',
    'PUT',
)

mais ça n'a rien changé, je ne vois pas mes requêtes passées (alors que le GET oui)

[thorgal1612]

J'ai réussi en changant .map en .subscribe

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
return this.apiService.post('/api-token-auth/', {username: username, password: password })
      .subscribe(res => console.log(res.Json()));

Je ne suis pas certain de bien comprendre la différence.

Ceci dit, je vois bien ma requête mais j'ai une erreur

{"detail":"Type de média \"text/plain\" non supporté."}

Une idée ?

[keokaz]

bonjour,

map est une fonctionne qui travaille sur un nouveau tableau par exemple le trier,
subscribe va permettre de récupérer la donnée api, elle permettra d'utiliser les observables.

https://makina-corpus.com/blog/metie...s-dans-angular

c'est ce que je pense (sauf si j'ai dis des bêtises ...)