IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

AngularJS Discussion :

Incapacité à récupérer les données de ma servlet (angulars & Jee)


Sujet :

AngularJS

  1. #1
    Membre averti
    Homme Profil pro
    Étudiant
    Inscrit en
    Octobre 2015
    Messages
    34
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Finistère (Bretagne)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Octobre 2015
    Messages : 34
    Par défaut Incapacité à récupérer les données de ma servlet (angulars & Jee)
    Bonjour,

    Je développe dans le cadre de ma formation un projet de site eCommerce. Je souhaite afficher mes articles cependant lorsque j'appelle ma Servlet cela ne fonctionne pas. Je ne sais pas comment parvenir pour faire communiquer ma Servlet et ma Vue.

    Voici le code :

    Ma Servlet :
    L'important étant dans le doGet, je récupère les informations stocké dans ma base de donnée et je mets ces données sous forme de Json : (ligne 46)

    http://pastebin.com/wHiNWmSu

    Mon code AngularJS :

    http://pastebin.com/kKrdFZC5


    -J'affiche le minimum en sachant que si je met les informations que je récupère de la base de donnée dans un Json cela fonctionne. Et si je récupère les informations stocké dans un Json a partir de mon controller Article cela fonctionne également. (Dans ce cas là, je n'ai pas besoin de la Servlet)
    -J'ai bien mis les dépendances de ma Servlet dans mon fichier web.xml.

    J'aimerai simplement la chose en ne créant aucun fichier Json et en affichant directement mes informations à l'aide de ma Servlet.


    Merci d'avoir pris le temps de me lire,

    Benjamin P.

  2. #2
    Membre Expert

    Profil pro
    Inscrit en
    Décembre 2011
    Messages
    974
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2011
    Messages : 974
    Par défaut
    qu'est-ce que cela donne avec les modifications suivantes:

    servlet

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    @WebServlet("/contol")
    public class Control extends HttpServlet

    angularjs


    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    $http.get('http://localhost:8081/webApp/control').success(function(response)
    webApp étant le nom de ton application web

  3. #3
    Membre averti
    Homme Profil pro
    Étudiant
    Inscrit en
    Octobre 2015
    Messages
    34
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Finistère (Bretagne)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Octobre 2015
    Messages : 34
    Par défaut
    Cela n'affiche aucune erreur mais la page est totalement blanche

  4. #4
    Invité
    Invité(e)
    Par défaut
    Juste pour collaborer, avec PHP, après un accès Base de Données, je crée le Json comme ça : print_r(json_encode($data));
    $http de Angular lit donc un fichier Json qui "s'imprime", et ça marche bien, mais d'après ce que je comprends tu ne veux pas l'afficher, avec Java.

  5. #5
    Membre averti
    Homme Profil pro
    Étudiant
    Inscrit en
    Octobre 2015
    Messages
    34
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Finistère (Bretagne)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Octobre 2015
    Messages : 34
    Par défaut
    D'accords, ta méthode me paraît très simple et claire (malheur à moi d'avoir choisi JEE). Maintenant que j'ai réussi à faire le lien entre ma vue et la Servlet, il faut que je configure correctement la servlet désormais j'imagine.

    Juste pour savoir, ton $http.get prend en paramètre le fichier Json ? Ou l'url du fichier Json ?


    Je vais mettre résolu après et voir ça avec un ami directement, merci de votre aide.

  6. #6
    Invité
    Invité(e)
    Par défaut
    Heu en fait j'aime bien Jee. Je vais pas tarder à créer des services en AngularJs 1.x pour dialoguer avec Jee et accéder à une Bdd relationnelle, c'est bien utile. ( A vrai dire je pense préférer Jee à Php)

    En ce qui concerne PHP,

    j'ai un service AngularJs qui lance des parties de mon script PHP qui, lui imprime un fichier JSON (Il me semble que le return ne fonctionne pas, il faut utiliser print_r, j'avais tenté les deux, d'ou la présence dans le code...).

    Pour accéder à ma rqt sql dans mon controleur AngularJs, je tape par exemple :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    <!-- Lire la liste des utilisateurs -->
                crudPhp.getUtilisateurs().success(function(data){
                    $rootScope.utilisateurs = data;    
                });
    Le service s'adresse ensuite au fichier PHP:

    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
     .factory("crudPhp",function($http){
            var factory = {};
     
                factory.getUtilisateurs = function(){
                    return $http.get('dbtruc27.php?action=get_utilisateurs')
                }
     
                factory.creerUtilisateur = function(formData){
                    return $http.post('dbtruc27.php?action=creer_utilisateur' , formData)
                }
     
                factory.supprimerUtilisateur = function(id){
                    return $http.post('dbtruc27.php?action=supprimer_utilisateur' ,{"id":id})
                }
     
                factory.editerUtilisateur = function(id){
                    return $http.post('dbtruc27.php?action=editer_utilisateur' ,{"id":id})
                }
     
                factory.validerModification = function(formData){
                    return $http.post('dbtruc27.php?action=valider_modification' ,formData)
                }
            return factory
        });

    Mon fichier PHP, lui, se connecte à la base de données et imprime un résultat encodé au format JSON, à l'aide des fonctions json_encode() et print_r() :

    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
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    <?php
     
    include('configtruc27.php'); 
     
    /**  Switch Case pour récupérer la l'action demandée par le controleur  Angular **/
     
    switch($_GET['action'])  {
        case 'creer_utilisateur' :
                creer_utilisateur();
                break;
     
        case 'get_utilisateurs' :
                get_utilisateurs();
                break;
     
        case 'editer_utilisateur' :
                editer_utilisateur();
                break;
     
        case 'supprimer_utilisateur' :              
                supprimer_utilisateur();
                break;
     
        case 'valider_modification' :
                valider_modification();
                break;
    }
     
     
    /**  Function qui ajoute l'utilisateur en base de données MYSQL  **/
     
    function creer_utilisateur() {
        $data = json_decode(file_get_contents("php://input")); 
        $nom          = $data->nom ;    
        $prenom     = $data->prenom;
        $age         = $data->age;
        $email      = $data->email;
     
        print_r($data);
        $qry = 'INSERT INTO utilisateurs (nom,prenom,age,email) values ("' . $nom . '","' . $prenom . '",'.$age. ' ,"'.$email .'")';
     
        $qry_res = mysql_query($qry);
        if ($qry_res) {
            $arr = array('msg' => "Utilisateur ajouté correctement!!!", 'erreur' => '');
            $jsn = json_encode($arr);
            // print_r($jsn);
        } 
        else {
            $arr = array('msg' => "", 'erreur' => 'Erreur d insertion de l utilisateur');
            $jsn = json_encode($arr);
            // print_r($jsn);
        }
    }
     
     
    /**  Function to LIT les utilisateurs2 en Base de données Mysql **/
     
    function get_utilisateurs() {    
        $qry = mysql_query('SELECT * from utilisateurs');
        $data = array();
        while($rows = mysql_fetch_array($qry))
        {
            $data[] = array(
                        "id"            => $rows['id'],
                        "iduser"        => $rows['iduser'],
                        "nom"             => $rows['nom'],
                        "prenom"         => $rows['prenom'],
                        "age"            => $rows['age'],
                        "email"         => $rows['email']
                        );
        }
        print_r(json_encode($data));
     
    }
     
     
    /**  Function qui supprime un utilisateur en base de donnée mysql  **/
     
    function supprimer_utilisateur() {
        $data = json_decode(file_get_contents("php://input"));     
        $id = $data->id;     
        print_r($data)   ;
        $del = mysql_query("DELETE FROM utilisateurs WHERE id = ".$id);
        if($del)
        return true;
        return false;     
    }
     
     
    /**  Functionpour lire les caractéristiques d'un utilisateur en base mysql afin de les éditer **/
     
    function editer_utilisateur() {
        $data = json_decode(file_get_contents("php://input"));     
        $id = $data->id;  
        $qry = mysql_query("SELECT * from utilisateurs WHERE id = ".$id);
        $data = array();
       while($rows = mysql_fetch_array($qry))
        {
            $data[] = array(
                        "id"            => $rows['id'],
                        "iduser"        => $rows['iduser'],
                        "nom"             => $rows['nom'],
                        "prenom"         => $rows['prenom'],
                        "age"            => $rows['age'],
                        "email"         => $rows['email']
                        );
        }
        print_r(json_encode($data));
        return json_encode($data);  
    }
     
     
    /** Function de mise à jour d'un utilisateur **/
     
    function valider_modification() {
        $data = json_decode(file_get_contents("php://input")); 
        $id            = $data->id;
        $iduser        = $data->iduser;
        $nom          = $data->nom ;    
        $prenom     = $data->prenom;
        $age         = $data->age;
        $email      = $data->email;
     
       // print_r($data);
     
        $qry = "UPDATE utilisateurs set nom='".$nom."' , prenom='".$prenom."',iduser='".$iduser."',age='".$age."',email='".$email."' WHERE id=".$id;
     
        $qry_res = mysql_query($qry);
        if ($qry_res) {
            $arr = array('msg' => "Utilisateur modifié avec succès!!!", 'error' => '');
            $jsn = json_encode($arr);
            // print_r($jsn);
        } else {
            $arr = array('msg' => "", 'error' => 'Erreur dans la mise à jour de l enregistrement');
            $jsn = json_encode($arr);
            // print_r($jsn);
        }
    }
     
    ?>
    Du coup, je n'ai qu'un seul fichier PHP pour gérer toutes les connexions à la base de données, grâce au SWITCH CASE qui "route" les demandes du controleur AngularJs.

    Au final, $rootScope.utilisateurs est peuplé du resultat JSON qui est imprimé par mon fichier PHP. ($rootScope est déconseillé, faut juste mettre $scope).

    Grace au 2 way Binding, mes utilisateurs s'affichent dans mon HTML automatiquement.

    Ce code est de type mapping objet-relationnel

    Désolé de pas avoir encore d'exemple Jee sous la main
    Dernière modification par Invité ; 24/02/2016 à 20h50.

  7. #7
    Membre averti
    Homme Profil pro
    Étudiant
    Inscrit en
    Octobre 2015
    Messages
    34
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Finistère (Bretagne)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Octobre 2015
    Messages : 34
    Par défaut
    D'ac, ça marche ! sympa l'exemple de ton code en tout cas, ça me donne une idée du fonctionnement de l'application web avec php & angularJS =)

    Bonne continuation à toi et merci d'avoir publié ;-)

    A+

  8. #8
    Expert confirmé
    Avatar de sekaijin
    Homme Profil pro
    Urbaniste
    Inscrit en
    Juillet 2004
    Messages
    4 205
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 61
    Localisation : France, Yvelines (Île de France)

    Informations professionnelles :
    Activité : Urbaniste
    Secteur : Santé

    Informations forums :
    Inscription : Juillet 2004
    Messages : 4 205
    Par défaut
    si ça peut inspirer j'ai publié un post pour le même genre de problème avec extjs
    http://www.developpez.net/forums/d14...ax-json-extjs/

    A+JYT

  9. #9
    Membre averti
    Homme Profil pro
    Étudiant
    Inscrit en
    Octobre 2015
    Messages
    34
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Finistère (Bretagne)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Octobre 2015
    Messages : 34
    Par défaut
    Je vais y jeter un oeil, merci !


    Bonne journée,

    A+

  10. #10
    Expert confirmé
    Avatar de sekaijin
    Homme Profil pro
    Urbaniste
    Inscrit en
    Juillet 2004
    Messages
    4 205
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 61
    Localisation : France, Yvelines (Île de France)

    Informations professionnelles :
    Activité : Urbaniste
    Secteur : Santé

    Informations forums :
    Inscription : Juillet 2004
    Messages : 4 205
    Par défaut
    depuis j'utilise
    http://camel.apache.org/rest-dsl.html
    je l'ai sur servicemix mais ça fonctionne dans jee tomcat jetty etc.

    associé à http://camel.apache.org/jpa.html
    le tout deviens très simple le principe est :
    Code java : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    rest("/service")
      .post("/user")
      .to("jpa:User?persistenceUnit=local");

    A+JYT

  11. #11
    Membre averti
    Homme Profil pro
    Étudiant
    Inscrit en
    Octobre 2015
    Messages
    34
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Finistère (Bretagne)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Octobre 2015
    Messages : 34
    Par défaut
    Cela ne me parle pas plus que cela, je suis encore débutant et je n'ai jamais utilisé ce genre de chose. Ceci étant, merci pour le partage, je le garde de côté si besoin.

    Je me permet de revenir vers vous car je n'arrive pas à afficher mes articles. J'ai bien ma connexion avec ma servlet et l'affichage de mon site, mais l'affichage des articles reste caduc. Cela doit venir de mon $http.get('url') dans mon controler ou alors ma fonction n'est pas correct.

    Ci dessous le code de ma Servlet pour l'envoie des informations sous format json :

    http://pastebin.com/UvgMarh9

    Et voici mon controler Article :

    http://pastebin.com/xLqyYvWx


    Tout en sachant que ma fonction du controler Article fonctionne si dans l'url je place l'endroit d'un fichier Json dans mon projet. Mais je souhaite récupèrer directement par flux Json (si c'est possible) plutôt que de créer un fichier.json avec ma Servlet et de lire ce même fichier avec mon controler Article.

    J'espère être assez clair.

    Merci d'avance,

    Bonne journée,
    A+

  12. #12
    Invité
    Invité(e)
    Par défaut
    Salut, Pas sur que ce soit possible de lire un "flux json", Cf mon essai de faire un return qui ne marche pas en php, ce qui me fait penser à ton cas, j'ai été obligé de faire un print_r() qui imprime le Json dans le navigateur pour que Angular puisse le lire, pour tester, j'avais créé un json "bateau" avec mon script PHP et j'ai vu que ça marchait avec print_r(), je pouvais lancer directement le script PHP dans le nav et il imprimait bien un fichier JSON.

    Mais bon je ne peux pas aider plus que cela, pas assez d'xp sur ce sujet.
    Mon conseil serait déjà de s'assurer que la servlet imprime correctement le fichier JSON directement dans le navigateur, et de tester comme ça.

    Ta servlet pourrait-elle dans un premier temps imprimer le json en tapant son url dans le navigateur?

    De plus, cela permettrait de s'assurer que le JSon est bien formaté.
    Dernière modification par Invité ; 26/02/2016 à 12h40.

  13. #13
    Expert confirmé
    Avatar de sekaijin
    Homme Profil pro
    Urbaniste
    Inscrit en
    Juillet 2004
    Messages
    4 205
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 61
    Localisation : France, Yvelines (Île de France)

    Informations professionnelles :
    Activité : Urbaniste
    Secteur : Santé

    Informations forums :
    Inscription : Juillet 2004
    Messages : 4 205
    Par défaut
    on peut très bien retourner un flux json en java comme en php

    avec si peu d'info pas facile d'aider.
    pour la solution camel
    l'équipe a publié un exemple
    https://github.com/apache/camel/tree...rk-rest-tomcat

    le code se réduit à trois classes
    User.java qui est le type d'objet exposé par Rest
    UserService.java qui est une classe d'accès aux données (dans l'exemple elle garde en mémoire Map la liste de User)
    UserRouteBuilder.java qui est l'exposition de User avec l'API rest.

    le reste un fichier spring : camel-config.xml qui instancie les objets
    et le classique web.xml

    le seul point intéressant est UserRouteBuilder.java
    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
    public class UserRouteBuilder extends RouteBuilder {
     
        @Override
        public void configure() throws Exception {
     
            // configure we want to use spark-rest as the component for the rest DSL
            // and we enable json binding mode
            restConfiguration().component("spark-rest").bindingMode(RestBindingMode.json)
                // and output using pretty print
                .dataFormatProperty("prettyPrint", "true");
     
            // this user REST service is json only
            rest("/user").consumes("application/json").produces("application/json")
     
                .get("/view/{id}").outType(User.class)
                    .to("bean:userService?method=getUser(${header.id})")
     
                .get("/list").outTypeList(User.class)
                    .to("bean:userService?method=listUsers")
     
                .put("/update").type(User.class).outType(User.class)
                    .to("bean:userService?method=updateUser");
        }
     
    }
    la première partie définie la config rest le bindingMode indique que rest va communiqué en échangeant des donnée en JSON
    il n'y a donc rien à faire pour décoder ou encoder le json

    vient ensuite l'api elle même.
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    rest("/user").consumes("application/json").produces("application/json")
    l'api est exposée sur http://serveur:port/servlet/user le début de l'url est de la conf de la webapp
    elle consomme et produit des flux "application/json".

    suit les verbes rest get et put respectivement sur les urls
    GET http://serveur:port/servle/usert/view/123
    GET http://serveur:port/servle/usert/list
    POST http://serveur:port/servle/usert/update

    outType ouTypeList et type permettent de spécifier le type d'objet contenus dans le JSON
    et enfin to("bean...") indique quel service java appeler.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    .put("/update").type(User.class).outType(User.class)
                    .to("bean:userService?method=updateUser");
    se lit comme suit :
    lors d'un appel POST sur l'url http://serveur:port/servle/usert/update
    décoder le paquet json (bindingMode) comme étant un objet User
    appeler la méthode updateUser de l'objet userService.
    récupérer l'objet User retourné par la méthode et l'encoder en json
    renvoyer la réponse json à l'appelant.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    .get("/list").outTypeList(User.class)
                    .to("bean:userService?method=listUsers")
    lors d'un appel GET à l'url http://serveur:port/servle/usert/list
    appeler la méthode listUsers de l'objet userService.
    récupérer l'objet Collection<User> retourné par la méthode et l'encoder en json
    renvoyer la réponse json à l'appelant.

    A+JYT
    PS: je pense que la question à sa place dans le forum jee

  14. #14
    Membre averti
    Homme Profil pro
    Étudiant
    Inscrit en
    Octobre 2015
    Messages
    34
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Finistère (Bretagne)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Octobre 2015
    Messages : 34
    Par défaut
    Pour te répondre devwebsympa, effectivement mon json était imprimé dans le navigateur avec un "println(json)" si je me trompe pas, mais la méthode que j'ai dans l'angularJS récupèrer un fichier Json directement, là il n'arrivais pas à les afficher dans ma page demandé.

    Merci seakijin, j'ai partagé si peu de code car je pensais que cela venait de l'url que je sélectionnais dans ma méthode angularJS ou alors la méthode en elle même qui n'étais pas correct pour lire un flux json d'ou le post dans le forum angularJS.

    Je ne suis pas en capacité d'essayer tout ça aujourd'hui n'étant pas chez moi, j'essayerai cela lundi.


    Merci beaucoup d'avoir pris le temps de m'aider,

    Bonne continuation à vous,
    A+

Discussions similaires

  1. Récupérer les données d'un formulaire dans une servlet
    Par Rinel dans le forum Servlets/JSP
    Réponses: 7
    Dernier message: 27/12/2014, 11h49
  2. Réponses: 5
    Dernier message: 17/11/2008, 17h29
  3. [](VB) Récupérer les données dans un fichier .xml
    Par Furius dans le forum VBScript
    Réponses: 4
    Dernier message: 02/10/2005, 20h39
  4. Récupérer les données interbase dans une TStringGrid
    Par Ousse dans le forum Bases de données
    Réponses: 1
    Dernier message: 24/03/2005, 12h51
  5. Récupérer les données d'une iframe
    Par juli1 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 4
    Dernier message: 09/02/2005, 22h53

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo