Discussion :

[sylvain257]

Bonjour,

Voila mon questionnement. Je fonctionne par un système de modules et notamment le module Utilisateur, qui identifie un utilisateur de mon application.

Ma classe User :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
class User {
    constructor({
        user=''
    }){
        this._user = user
    }
 
    getProfile(){
        const API_AUTH = '*******'
        const user = parseInt(this._user);
 
        return $.ajax({
            url: API_AUTH + 'user/'+ user,
            dataType:'json',
            type:'GET'
        })
    }
 
    setProfile(){
 
        var req = this.getProfile().done(this.returnData);
 
        console.log(req);
        return req;
    }
 
    returnData(data){
        var resultat = data;
        return resultat;
    }
 
}

Quand je demande une instance de classe dans un autre fichier, comme ci-dessous, je me retrouve non pas avec une response JSON mais avec toute une série de prototypes dont done, then et responseJSON.

Code :

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

{readyState: 1, getResponseHeader: ƒ, getAllResponseHeaders: ƒ, setRequestHeader: ƒ, overrideMimeType: ƒ,*…}

Quand je fais un console.log de data.responseJSON, cela me renvoie undefined alors que le prototype est bien présent. En gros je ne peux pas descendre dans l'arborescence.

Le but ultime est qu'un développeur qui souhaite développer une application en utilisant ce module, il n'ai qu'à écrire le code ci-dessous

Code :

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

1
2
3
4
5
6
7
var user = new User({
    user:user_id
})
 
var data = user.setProfile();
 
// et pas user.setProfile().done etc...

Il est évident qu'il y a un truc que je ne fais pas bien mais je ne sais pas trop quoi....

Merci pour votre aide

Sylvain

[licardentaistor]

Le problème que vous rencontrez vient du fait que vous essayez de traiter une réponse asynchrone de manière synchrone. L'appel AJAX est asynchrone par nature, et vous devez gérer la réponse de manière appropriée en utilisant des promesses ou des async/await.

Code javascript :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
 
class User {
    constructor({ user = '' }) {
        this._user = user;
        this.API_AUTH = '*******'; // Assurez-vous de remplacer '*******' par l'URL réelle de votre API
    }
 
    async getProfile() {
        const user = parseInt(this._user);
        const response = await $.ajax({
            url: `${this.API_AUTH}user/${user}`,
            dataType: 'json',
            type: 'GET'
        });
        return response;
    }
 
    async setProfile() {
        try {
            const data = await this.getProfile();
            console.log(data);
            return data;
        } catch (error) {
            console.error('Error fetching profile:', error);
            throw error;
        }
    }
}
 
// Utilisation de la classe User
async function main() {
    var user = new User({ user: user_id });
 
    try {
        var data = await user.setProfile();
        console.log(data); // Traitez vos données ici
    } catch (error) {
        console.error('Failed to set profile:', error);
    }
}
 
main();

[sylvain257]

En fait j'étais pas loin, mais je faisais la demande en synchrone et pas en asynchrone.

Merci en tout cas.

Sylvain