[AJAX] consommer un webservice avec Ajax

**webfranc** · 16/01/2010, 17h58

Bonjour,

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
 <html>
   <head><title>Example SOAP application</title>
    <script src="xmlhttp.js" type="text/javascript"></script>
    <script src="soapfun.js" type="text/javascript"></script>
    <script src="domfun.js" type="text/javascript"></script>
   </head>
 
   <body> 
 
    <script type="text/javascript"> <--
    function upd()
{
  var item = document.getElementById('PlaceName').value;
  var url = 'http://www.webservicex.net/WeatherForecast.asmx';
  var params = {PlaceName:PlaceName};
  SOAP.q_async_trans(url, 'http://www.webservicex.net', 'GetWeatherByPlaceName', params, upd_ok, upd_nok);
}
 
function upd_ok(data)
{
  var responseblock = document.getElementById('GetWeatherByPlaceNameResponse');
  var app = function(obj) { responseblock.appendChild(obj) }
  dom_wipe(responseblock)
 
  app(dom_tag_with_children('b', [dom_text('count: ')]));
  app(dom_text(data.GetWeatherByPlaceNameResponse.GetWeatherByPlaceNameResult.Latitude));
}
      function upd_nok(responseobject)
      {
        alert("Not ok");
      }
--></script>
 
      Input: <input type="text" id="item" onchange="upd()"><br>           
 
      <div id="GetWeatherByPlaceNameResponse" style="width:50%;height:100px;border:1px solid blue"></div>
 
     </body>
    </html>

liens de test: http://latrach.net/test/testws_ajax.php
ce webservice me permet de retourner l'altitude d'une ville americaine en entree
exemple : miami

je pense qu'il manque queluechose dans mon code?

merci de voir avec moi et m'apporter une aide je vous serais reconnaissant

**emmanuel.remy** · 18/01/2010, 16h24

Salut,

Déjà un souci:

Code :

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

1
2
3
 
var item = document.getElementById('PlaceName').value;
var params = {PlaceName:PlaceName};

, alors que c'est plutôt

Code :

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

1
2
3
 
var item = document.getElementById('PlaceName').value;
var params = {PlaceName:item};

Ensuite faudra savoir quelle est la version SOAP utilisée, car en 1.1 il faut ajouter un header SOAPAction.

ERE

EDIT: Attends toi à avoir d'autres surprises car cette librairie me semble très orientée PHP; je te confirme par ailleurs que c'est bien item qu'il faut mettre

**webfranc** · 19/01/2010, 09h24

salut,
merci pour ta reponse, j'ai fait la modification citée , voici les code source: http://latrach.net/test/
cela ne fonctionne toujours pas!
as tu une autre piste avec un autre Framework

**emmanuel.remy** · 19/01/2010, 09h42

Salut,

Envoyé par webfranc

salut,
merci pour ta reponse, j'ai fait la modification citée , voici les code source: http://latrach.net/test/
cela ne fonctionne toujours pas!
as tu une autre piste avec un autre Framework

Ton principal souci c'est qu'on t'a vendu du SOAP à tout va (vive le marketing, vive REST). Sais tu comment fonctionne ton webservice ? Es tu allé sur sa page ? T'es tu documenté ? A priori non...

Si tu vas ici (http://www.webservicex.net/WeatherFo...herByPlaceName) tu liras que ton webservice peut être appelé par un HTTP GET (il n'y a pas que SOAP dans la vie). Finalement un simple appel AJAX du style http://www.webservicex.net/WeatherFo...ceName=chicago te renverra cette structure que tu n'as plus qu'à parser:

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
<?xml version="1.0" encoding="utf-8"?>
<WeatherForecasts xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns="http://www.webservicex.net">
  <Latitude>41.8858452</Latitude>
  <Longitude>87.6181259</Longitude>
  <AllocationFactor>0.000401</AllocationFactor>
  <FipsCode>17</FipsCode>
  <PlaceName>CHICAGO</PlaceName>
 
  <StateCode>IL</StateCode>
  <Details>
    <WeatherData>
      <Day>Tuesday, January 19, 2010</Day>
      <WeatherImage>http://forecast.weather.gov/images/wtf/nfg.jpg</WeatherImage>
      <MaxTemperatureF>31</MaxTemperatureF>
      <MinTemperatureF>26</MinTemperatureF>
 
      <MaxTemperatureC>-1</MaxTemperatureC>
      <MinTemperatureC>-3</MinTemperatureC>
    </WeatherData>
    <WeatherData>
      <Day>Wednesday, January 20, 2010</Day>
      <WeatherImage>http://forecast.weather.gov/images/wtf/bkn.jpg</WeatherImage>
      <MaxTemperatureF>32</MaxTemperatureF>
 
      <MinTemperatureF>29</MinTemperatureF>
      <MaxTemperatureC>0</MaxTemperatureC>
      <MinTemperatureC>-2</MinTemperatureC>
    </WeatherData>
    <WeatherData>
      <Day>Thursday, January 21, 2010</Day>
      <WeatherImage>http://forecast.weather.gov/images/wtf/ra40.jpg</WeatherImage>
 
      <MaxTemperatureF>35</MaxTemperatureF>
      <MinTemperatureF>31</MinTemperatureF>
      <MaxTemperatureC>2</MaxTemperatureC>
      <MinTemperatureC>-1</MinTemperatureC>
    </WeatherData>
    <WeatherData>
      <Day>Friday, January 22, 2010</Day>
 
      <WeatherImage>http://forecast.weather.gov/images/wtf/ovc.jpg</WeatherImage>
      <MaxTemperatureF>36</MaxTemperatureF>
      <MinTemperatureF>31</MinTemperatureF>
      <MaxTemperatureC>2</MaxTemperatureC>
      <MinTemperatureC>-1</MinTemperatureC>
    </WeatherData>
 
    <WeatherData>
      <Day>Saturday, January 23, 2010</Day>
      <WeatherImage>http://forecast.weather.gov/images/wtf/ra30.jpg</WeatherImage>
      <MaxTemperatureF>38</MaxTemperatureF>
      <MinTemperatureF>28</MinTemperatureF>
      <MaxTemperatureC>3</MaxTemperatureC>
 
      <MinTemperatureC>-2</MinTemperatureC>
    </WeatherData>
    <WeatherData>
      <Day>Sunday, January 24, 2010</Day>
      <WeatherImage>http://forecast.weather.gov/images/wtf/rasn40.jpg</WeatherImage>
      <MaxTemperatureF>45</MaxTemperatureF>
      <MinTemperatureF>37</MinTemperatureF>
 
      <MaxTemperatureC>7</MaxTemperatureC>
      <MinTemperatureC>3</MinTemperatureC>
    </WeatherData>
    <WeatherData>
      <Day>Monday, January 25, 2010</Day>
      <WeatherImage>http://forecast.weather.gov/images/wtf/sn30.jpg</WeatherImage>
      <MaxTemperatureF>37</MaxTemperatureF>
 
      <MinTemperatureF>31</MinTemperatureF>
      <MaxTemperatureC>3</MaxTemperatureC>
      <MinTemperatureC>-1</MinTemperatureC>
    </WeatherData>
  </Details>
</WeatherForecasts>

Ha!! les docs...

ERE

**webfranc** · 20/01/2010, 21h11

merci pour ta réponse, j'ai utilisé la methode GET en parsant le xml avec Jquery

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
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript" src="jquery.js"></script>
<title>Insert title here</title>
</head>
<body>
 
<div id="Div_XML"></div>
 
 
<script>
$(document).ready(  
 function()
 {
   $.ajax( {
            type: "GET",
            url: "GetWeatherByPlaceName.xml", //"http://www.webservicex.net/WeatherForecast.asmx/GetWeatherByPlaceName?PlaceName=miami",
            dataType: "xml",
            success: function(xml) 
                     {
                       $(xml).find('WeatherData').each(   
                         function()
                         {
                            var Day = $(this).find('Day').text();
                            var WeatherImage = $(this).find('WeatherImage').text();
                            $('<input type="text" name="' + Day +'" value="' + Day + '" size="50" /><img src="' + WeatherImage + '"><br>').appendTo('#Div_XML');
 
                          });
                      }
        });
  }
);
 
    </script>
</body>
</html>

le code fonctionne uniquement quand je passe le fichier xml url: "GetWeatherByPlaceName.xml", par contre quand je passe le lien http : "http://www.webservicex.net/WeatherForecast.asmx/GetWeatherByPlaceName?PlaceName=miami", cela ne fonctionne pas!?

avez vous une idée? merci de votre aide
pur info mon code ici : http://latrach.net/Dev/jquery/ws_jqu...PlaceName.html

**Bovino** · 20/01/2010, 22h08

Une petite recherche sur la "Same Origin Policy" ?

[AJAX] consommer un webservice avec Ajax

AJAX

Vue hybride

Discussions similaires

Partager

Partager