AngularJS - SAVON à l'Intégration des Services Avec AngularJS Modèle
Je suis un inconditionnel de Flex Développeur qui est l'apprentissage AngularJS. C'est tellement difficile!!!
De toute façon, je suis en train de faire un appel de service à mon backend (sur le même domaine) serveur via un SOAP WSDL Demande, et de remplir les données avec un AngularJS modèle objet. J'ai essayé Ajax mais a avoir quelques problèmes à obtenir les données réelles de retour. Je pense qu'il ya quelque chose de mal avec la façon dont j'ai créé le SAVON tag. J'ai été faire un succès de la réponse, mais pas de données.
Après ne pas être en mesure de comprendre la méthode Ajax, je suis tombé sur soapclient.js et l'a trouvé pour être très facile, avec moins de code que l'Ajax. soapclient.js ne fait la plupart du travail pour vous, semblable à la méthode Ajax, ce qui le rend beaucoup moins de code. En outre, l'utilisation soapclient.js je suis en mesure de faire l'appel SOAP et aussi de récupérer des données au format XML de la réponse.
http://javascriptsoapclient.codeplex.com
Mon problème est que je suis en train d'utiliser AngularJS pour le vidage de la réponse XML dans un AnularJS modèle objet. Je ne suis pas sûr de la façon de configurer le projet AngularJS pour ce que je fais, mais j'aimerais vraiment savoir quelle est la meilleure méthode pour garder ce que je suis en train de travailler sur découplés. J'ai été la recherche Google comme un fou, mais la plupart des exemples semblent trop compliqué pour un débutant.
Voici ce que j'ai:
<html>
<head>
<script language="JavaScript" type="text/javascript" src="jquery-1.10.1.js"></script>
<script language="JavaScript" type="text/javascript" src="soapclient.js"></script>
<script type="text/javascript">
function getData() {
var url2 = "https://myService";
var pl = new SOAPClientParameters();
pl.add("arg0", false);
SOAPClient.invoke(url2, "methodToCall", pl, true, getDataCallback);
}
function getDataCallback(r, soapResponse) {
alert(r.contents.payeeMailName);
}
</script>
</head>
<body>
<form>
<input type="button" value="Click Here to Call Web Service" onClick="getData()" style="width: 192px">
</form>
<div id="result">Result?</div>
</body>
</html>
Maintenant, le SAVON de service renvoie les données comme ceci:
<return>
<contents>
<eftAcctType>S</eftAcctType>
<id>
<djNumber>201-16-39063</djNumber>
<djSequence>1</djSequence>
</id>
<payeeAddrLine1>124 Agate Drive</payeeAddrLine1>
</contents>
<contents>
<eftAcctType/>
<id>
<djNumber>201-16-39201</djNumber>
<djSequence>1</djSequence>
</id>
<payeeAddrLine1>c/o Kevin Martinez, Attorney at Law</payeeAddrLine1>
</contents>
<contents>
<eftAcctType>C</eftAcctType>
<id>
<djNumber>201-16-38561</djNumber>
<djSequence>1</djSequence>
</id>
<payeeAddrLine1>1360 South Highway 191</payeeAddrLine1>
</contents>
<status>0</status>
</return>
Quelle est la "bonne" façon AngularJS pour faire l'appel de service, en supposant que le chemin que j'ai fait c'est ok, si non, laissez-moi savoir la meilleure façon, et puis, dans la suite, comment puis-je boucle les données dans le fichier XML de la réponse et de l'analyser dans Angulaire de l'objet du modèle? J'ai finalement souhaitez utiliser ces données dans un DataGrid.
Toute aide sera très appréciée.
Vous devez vous connecter pour publier un commentaire.
Deux ans de retard, mais j'ai construit un module Angulaire pour le travail avec du SAVON services web qui est hébergé sur GitHub.
https://github.com/andrewmcgivery/angular-soap
Ici est un blog sur la façon de l'utiliser:
http://mcgivery.com/soap-web-services-angular-ionic/
Longue histoire courte, il permet de faire quelque chose comme ceci:
<SOAP-ENV:Envelope><SOAP-ENV:Body>
au lieu de<soap:Envelope><soap:Body>
qui sont actuellement produites par votre module. Merci.Je suppose que la meilleure façon serait de l'appliquer comme un $http intercepteur. Je l'ai fait en notre projet et il a très bien fonctionné parce que l'angle $http appels restent les mêmes.
C'est un lien vers le fournisseur que j'ai créé pour notre projet : http://jsfiddle.net/gqp9m/
J'ai fait quelques copier-coller à partir de la soapclient bibliothèque et déplacé dans un fournisseur. J'ai aussi changé un peu de la syntaxe de sorte que le code va passer jsHint. Plus de la modification de la fonction sont commentés avec des notes de documentation. Elle nécessite également de jQuery (pour l' $.parseXML de la fonction - vous pouvez restructurer afin de supprimer la dépendance en jQuery).
La plus grande différence, c'est que mon code ne prend pas en charge le wsdl lors de la première demande, mais plutôt a besoin de vous pour mettre en cache avant de faire tout l'appel, comme suit :
savon est injecté savon-intercepteur instance. Vous appelez le wsdl et ensuite appeler savon.setWSDL passant l'url de base et la résolu wsdl. Notez également la isJSON argument transmis à l' $http appel. C'est là parce que par défaut de mon code traite chaque appel d'une requête SOAP. C'est ce que les intercepteurs de le faire. isJSON:vrai vous permettra d'utiliser $http que dieu a destiné 😉
Après l'appel de setWSDL appelez simplement $http comme vous le faites toujours:
N'oubliez pas que ce code a été écrit pour notre projet et il n'est pas pris en charge un projet open source ou quelque chose. Il peut avoir besoin d'un certain niveau de maintenance ou de refactoring avant de pouvoir l'utiliser, mais c'est un bon début.
<wsdl:message name="getPriceRequest"> <wsdl:part name="symbol" type="xsd:string"/> </wsdl:message> <wsdl:message name="getPriceResponse"> <wsdl:part name="return" type="xsd:float"/> </wsdl:message>
Vous pouvez l'obtenir sans aucun SOAP wsdl bibliothèques. importez votre fichier wsdl dans le SAVON de l'INTERFACE utilisateur et la copie de l'enveloppe. ci-dessous l'exemple de la AngularJS comment gérer Web Service SOAP.
Service:
appeler le service et gérer le XML de sortie. vous pouvez capturer les attributs que vous souhaitez: