Consommer un service Web dans Javascript

28 mars 2005

Consommer un service Web dans Javascript

Problématique traitée : L’exemple que je traite dans ce tutorial, m’a été suggéré par un collègue qui voulait suivre les visites des internautes entre deux sites données n'utilisant pas le framework .Net.
Pré-requis : .Net, C#, Javascript

Le travail à effectuer pour résoudre ce problème peut se composer en 3 étapes :
a. Créer le web service
b. Génération d'un proxy de service Web XML
c. Consommation du service Web à partir d’une page Html

a. Création du web service
Pour créer le web service en question, on peut utiliser la template fournie dans l’environnement Visual.Net ou utiliser le célèbre notepad (ce qui est fastidieux mais largement accessible !..).

VisitCounter.asmx

using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Data.SqlClient;
using System;

public class VisitCounter: System.Web.Services.WebService
{
[WebMethod]
public bool saveVisitHint (string vdtVisit, string vsiteName1, string vsiteName2, string vip, string vcompaignName)
{
try {
string _strConn = "";
"uid=saconn;pwd=myPassword;database=VisitCounterDB;server=(local);";
SqlConnection oConn = new SqlConnection(_strConn);
oConn.Open();
SqlCommand oComm = new SqlCommand("insert into TVisitCounter(dtVisit,siteName1,siteName2,ipAdress,compaignName) values ('" + vdtVisit +"','" + vsiteName1 + "','" + vsiteName2 + "','" + vip +"','" +vcompaignName+"');", oConn);

oComm.ExecuteNonQuery();
return true;
}
catch (Exception e)
{
return false;
}
}
}

Ce web service permet d’enregistrer le clic de l’utilisateur dans une base de données sql server (date visite, Site source, site de destination, adresse IP du client, nom de campagne).

b. Génération d'un proxy de service Web XML
Pour accéder à un service Web XML à partir d'une application cliente, vous ajoutez d'abord une référence Web, qui est une référence à un service Web XML. Quand vous créez une référence Web, Visual Studio crée automatiquement une classe proxy de service Web XML et l'ajoute à votre projet. Cette classe proxy expose les méthodes du service Web XML et gère le marshaling des arguments appropriés entre le service Web XML et votre application. Visual Studio utilise le langage WSDL pour créer le proxy.
Pour cela, on utilise l’utilitaire WSDL comme suit
c:> WSDL http://localhost/yourWebServices/ VisitCounter.asmx?WSDL

c. Consommation du service Web à partir d’une page Html
<html>
<head >
<title>Untitled Page</title>
<script language = "JavaScript">
      function init(){
         alert("Debut ");
         service.useService("http://localhost/VisiteCounterService/VisitCounter.asmx?WSDL","Service1");
      }

      // Traitement d'appel à la méthode saveVisitHint du serviceWeb
      function imageClicked ()
      {
         var iCallID;
         var d = new Date();

         var vDate = d.getYear() + "-" + (d.getMonth()+1) + "-" + d.getDate() + " " + d.getHours() +":" + d.getMinutes() +":" + d.getSeconds() + ".000";
         alert (vDate);

         iCallID = service.Service1.callService(oCallHandler,"saveVisitHint",vDate,"site Appelant", "site Appelé", "192.100.120.453", "Nom Comapgne") ;

      }
      function oCallHandler (result)
      {
         if (result.error)
         {
                  var retResultcode = result.errorDetail.code;
                  alert (retResultcode);
                  var retResultstring = result.errorDetail.string;
                  alert (retResultstring);
                  var retResultsoap = result.errorDetail.raw;
                  alert (retResultsoap);
         }
         else
         {
            alert(result.value);
         }
      }
</script>
</head>
<body onLoad="init()">

<img src="logo_acadomia.jpg" onclick = "imageClicked()"/>
<div id="service" style="behavior:url(webservice.htc)" >

</div>
</body>
</html>

Remarque : Il faut télécharger le fichier Webservice.htc et le placer dans le repertoire où réside la page html.

Posté par halim à 22:44 - Commentaires […] - Permalien [#]

Partager cet article

Vous aimez ?

0 vote

Intégrer un contrôle utilisateur Windows dans une page HTML

Commentaires