Parsing de page Javascript.

**katcha95** · 11/02/2010, 13h25

Salut a tous,

Je cherche a recuperer automatiquement des informations dans une page web. Je sais le faire a partir du moment que l'information se trouve dans le code source HTML de la page. Mais lorsqu'il s'agit d'une page avec du Javascript dedans, impossible !
Voici un exemple:

Comment recuperer la valeur "UVP" et "Sie zahlen" sur le site: https://www.docmorris.de/de/

1) Taper 3464237 comme valeur dans la case "Suche"

2) Vous aurez la description du produit, je cherche donc a recuperer les valeurs de 'UVP' et "Sie zahlen".

Je suis ouvert a toute idee. A+

**Mac LAK** · 11/02/2010, 13h51

Envoyé par katcha95

Je suis ouvert a toute idee. A+

Il faudrait que tu vérifie si ce ne sont pas, tout simplement, des requêtes AJAX qui remplissent le tableau... Dans ce cas, tu peux simuler les requêtes en question et réussir, enfin, à récupérer les valeurs qui t'intéressent.

**katcha95** · 11/02/2010, 15h44

Ton idée est un peu flou pour moi. J'ai rapidement conclue que ce site utilise surement du AJAX avec cette ligne: <script type="text/javascript" charset="utf-8" src="/de/include/js/ajax.js"></script>
Mais je ne vois pas comment on peux simuler des requêtes Ajax, sachant déjà que je n'y connait rien à ce langage. J'ai aussi fait une inspection sur le tableau en vert, avec Firebug et il me ressort le code source entier, avec les informations que je souhaite avoir. Ce qui me tracasse, c'est que je ne sait pas comment Firebug récupère ce code source, comment il fonctionne (Même en lisant la docs) et s'il existe un script qui peut demander à Firebug de m'enregistrer automatiquement le code source pour que mon programme les récupère et travail dessus.

A+

**Mac LAK** · 11/02/2010, 15h53

Ajax ?? Ben... C'est une requête HTTP bête et méchante, tout simplement !!

Par contre, elle renvoie des données fragmentaires, et non pas une page complète en bonne et dûe forme.
Tu peux sniffer ce qu'il se passe avec Wireshark, ou Firebug (il permet de tracer les XmlHttpRequest), et ainsi voir sur quelle URL il faut taper pour obtenir les informations que tu cherches.

Firebug se base sur le document courant, au niveau interne, et se contente d'explorer le DOM. En gros, il lit la même chose que le navigateur pour dessiner sur l'écran. Je ne crois pas qu'il aie une fonction de sauvegarde, et de toutes façons, ce serait plus coûteux que quoi que ce soit d'autre. Autant corriger ta requête et taper sur la "bonne" URL (celle ciblée par Ajax) plutôt que sur l'URL principale.

**katcha95** · 11/02/2010, 15h58

Un peu confus pour moi tous ça...en gros tu veux récupérer l'URL du tableau ?

A+

**Mac LAK** · 11/02/2010, 18h23

Envoyé par katcha95

en gros tu veux récupérer l'URL du tableau ?

C'est presque ça. Le tableau est récupéré via une requête AJAX, donc pour toi c'est une URL un peu particulière, qui renverra un bout de code HTML contenant notamment les données en question.

Est-ce plus clair ? Pour mieux comprendre, active le suivi des XmlHttpRequest dans Firebug, et fais une recherche sur le site en question. Regarde le contenu des données retournées, ensuite.

**katcha95** · 12/02/2010, 13h55

ça peux être une idée, mais je cherche un moyen beaucoup plus efficace, car mon programme est itérative et travailler avec des données fragmentaire c'est pas top...d'autre proposition ?

A+

**Mac LAK** · 12/02/2010, 16h27

Envoyé par katcha95

ça peux être une idée, mais je cherche un moyen beaucoup plus efficace, car mon programme est itérative et travailler avec des données fragmentaire c'est pas top...d'autre proposition ?

Fragmentaires au sens HTML : tu n'as pas les balises encadrant le texte (notamment <header>, <body>, etc.), mais tu as à la place un des éléments suivants :

Un fichier XML contenant les données cherchées, sans rien d'autre pour polluer,
Un bloc de code HTML (ex : le contenu d'un <tr>) parfaitement légitime.
Des données texte reprenant la même chose que le XML cité en premier.

Bref, tu n'as au contraire QUE des avantages à le faire, et pas beaucoup d'inconvénients... Je t'avoue que je ne comprends pas trop ta réticence, sur ce coup, surtout que c'est en plus la seule solution viable que tu aie.

**katcha95** · 13/02/2010, 18h17

C'est peut-être parce-que je n'ai pas totalement bien compris ton idée (Je suis honnête). Si tu peux détailler le principe par un exemple ?

A+

**Mac LAK** · 13/02/2010, 18h37

Envoyé par katcha95

C'est peut-être parce-que je n'ai pas totalement bien compris ton idée (Je suis honnête). Si tu peux détailler le principe par un exemple ?

C'est pourtant tout bête, et tu l'aurais vu si tu avais essayé...

Ouvre Firebug, active tous les panneaux (surtout le panneau "Réseau" !!!), va sur ta page et lance la recherche. Une connexion AJAX est tracée, avec ces paramètres (scrolle la fenêtre) :

Code Requête :

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

URL ciblée : https://www.docmorris.de/docmorris/product/select;095A225F0F1F0DF5532D6A1B4C31666B.n01?_r_=0.48550302050921756&baseId=29994&highlightPzn=3464237&page=1

On y voit donc le code numérique que tu avais tapé dans la zone de saisie. Le reste, c'est dépendant du site, faudra voir ce qui est nécessaire et ce qui ne l'est pas.

On récupère ensuite :

Code Réponse :

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
<div class="npl-layer-left">
	<h3>Rezeptart wählen</h3>
	<ul>
					<li class="active" onclick="updateSelect('29994','OR','1','','3464237');"><input type="radio" name="rezeptart" value="OR" id="rezeptart-1" checked="checked"/><label for="rezeptart-1">Ohne Rezept</label></li>
											<li onclick="updateSelect('29994','PKV','1','','3464237');"><input type="radio" name="rezeptart" value="PKV" id="rezeptart-4"/><label for="rezeptart-4">Mit Privatrezept</label></li>
			</ul>
</div>
<div class="npl-layer-right">
	<h3>Packungsgrösse wählen und Produkt bestellen</h3>
	<div class="table-container">
		<table border="0">
		<tbody>
										<tr class=" ">
					<td class="description">
 
						<strong>40 St</strong>
						<br/>
						Brausetabletten<br/>
						<span class="grey pzn">PZN 3464237</span>
					</td>
					    					<td class="price-description">
    						    							UVP<br/>
    						    						    							<a href="#" onclick="openSavings('3464237','OR','1'); return false;" class="red"><span class="hover-red info-icon">Ersparnis</span></a><br/>
    						    						Sie zahlen
    					</td>
										<td class=" product-price " >
																					<span title="Statt">13,95&nbsp;&euro;</span><br/>
																						<a href="#" onclick="openSavings('3464237','OR','1'); return false;" class="red" title="Ersparnis"><span title="Sie sparen" class="hover-red">4,20&nbsp;&euro;</span></a><br/>
							    						<strong title="DocMorris Preis">9,75&nbsp;&euro;</strong>
											</td>
					<td class="options">
													<a href="#" onclick="addToCart('3464237','OR', '1'); return false;"><img alt="Warenkorb" title="Warenkorb" src="/de/art/npl/warenkorb.gif" class="hover-img wk-button"/></a>
											</td>
				</tr>
				    				<tr>
    					<td colspan="4" class="line"><img alt="" src="/de/art/npl/dashed_line.gif"/></td>
    				</tr>
											<tr class=" ">
					<td class="description">
 
						<strong>20 St</strong>
						<br/>
						Brausetabletten<br/>
						<span class="grey ">PZN 1894063</span>
					</td>
					    					<td class="price-description">
    						    							UVP<br/>
    						    						    							<a href="#" onclick="openSavings('1894063','OR','1'); return false;" class="red"><span class="hover-red info-icon">Ersparnis</span></a><br/>
    						    						Sie zahlen
    					</td>
										<td class=" product-price " >
																					<span title="Statt">8,89&nbsp;&euro;</span><br/>
																						<a href="#" onclick="openSavings('1894063','OR','1'); return false;" class="red" title="Ersparnis"><span title="Sie sparen" class="hover-red">1,94&nbsp;&euro;</span></a><br/>
							    						<strong title="DocMorris Preis">6,95&nbsp;&euro;</strong>
											</td>
					<td class="options">
													<a href="#" onclick="addToCart('1894063','OR', '1'); return false;"><img alt="Warenkorb" title="Warenkorb" src="/de/art/npl/warenkorb.gif" class="hover-img wk-button"/></a>
											</td>
				</tr>
				    				<tr>
    					<td colspan="4" class="line"><img alt="" src="/de/art/npl/dashed_line.gif"/></td>
    				</tr>
											<tr class=" ">
					<td class="description">
 
						<strong>10 St</strong>
						<br/>
						Brausetabletten<br/>
						<span class="grey ">PZN 1406632</span>
					</td>
					    					<td class="price-description">
    						    							UVP<br/>
    						    						    							<a href="#" onclick="openSavings('1406632','OR','1'); return false;" class="red"><span class="hover-red info-icon">Ersparnis</span></a><br/>
    						    						Sie zahlen
    					</td>
										<td class=" product-price " >
																					<span title="Statt">5,28&nbsp;&euro;</span><br/>
																						<a href="#" onclick="openSavings('1406632','OR','1'); return false;" class="red" title="Ersparnis"><span title="Sie sparen" class="hover-red">1,33&nbsp;&euro;</span></a><br/>
							    						<strong title="DocMorris Preis">3,95&nbsp;&euro;</strong>
											</td>
					<td class="options">
													<a href="#" onclick="addToCart('1406632','OR', '1'); return false;"><img alt="Warenkorb" title="Warenkorb" src="/de/art/npl/warenkorb.gif" class="hover-img wk-button"/></a>
											</td>
				</tr>
									</tbody>
		</table>
	</div>
	</div>
<div id="ajax-data">
	<div id="ajax-layer-data">
    	<span id="for-npl-product-image"><img src="/images/products/w50/3464237.jpg" width="50"/></span>
    	<span id="for-npl-product-name">Aspirin plus C</span>
    	<span id="for-manufacturer-name">
    		    		Bayer Selbstm.
    	</span>
    	<span id="for-npl-layer-details"><a href="/de/shop/produkte/Bayer-Selbstm/Aspirin-plus-C/Brausetabletten/29994;jsessionid=095A225F0F1F0DF5532D6A1B4C31666B.n01">Produktdetails</a></span>
	</div>
</div>
<br style="clear: both;"/>

J'ai mis le contenu intégral de la réponse. Comme tu peux le constater, les infos que tu cherches sont dedans, et ce n'est pas une page HTML complète mais bien des données fragmentaires. On y trouve par exemple un bout de texte valant "8,89 €", et apparemment, c'est encadré par un "<span title="Statt">". Tu n'as plus qu'à bosser sur le format utilisé sur le site pour retrouver tes informations de façon automatique, mais ça, apparemment, tu sais déjà le faire.

**katcha95** · 13/02/2010, 22h33

Salut,

Je comprend beaucoup mieux et je t'en remercie, je vais appliquer tous ça et m'intéresse au XmlHTTPRequest....il me manque plus qu'a trouvé comment simuler ma requête, je pense à faire cela là pour générer le tableau:
<a title="Ersparnis" class="red" onclick="openSavings('3464237','OR','1');

A+

**Mac LAK** · 13/02/2010, 22h49

Envoyé par katcha95

Je comprend beaucoup mieux et je t'en remercie, je vais appliquer tous ça et m'intéresse au XmlHTTPRequest....

De rien.

Envoyé par katcha95

il me manque plus qu'a trouvé comment simuler ma requête, je pense à faire cela là pour générer le tableau:
<a title="Ersparnis" class="red" onclick="openSavings('3464237','OR','1');

Une requête XmlHttpRequest n'est rien d'autre qu'une requête HTTP normale : c'est le résultat qui est "anormal", dans le sens où ce n'est pas une page Web complète (voire même pas de l'HTML du tout !).

Une requête HTTP peut être effectuée de façon simple avec des sockets, ou des éléments plus complexes. Par exemple, Windows fournit en standard des fonctions d'accès HTTP (HttpOpenRequest), tout comme certains IDE (Delphi / C++ Builder fournisent des objets d'encapsulation du navigateur et des principaux protocoles Internet, par exemple). Avec des sockets "brut de fonderie", il faudra que tu épluches un peu la RFC HTTP.

Dans tous les cas, cela va dépendre de ce que tu as sous le coude et de ce que tu as déjà fait, ainsi (en partie) que de ton système d'exploitation.

**katcha95** · 13/02/2010, 23h13

Encore merci pour ces précisions, je vais d'abord me tourner vers l'envoi de requêtes http avec les sockets par script PHP. et je verrais plus tard pour la lib Microsoft.

**Mac LAK** · 13/02/2010, 23h20

PHP ???? T'es sûr d'être dans le bon forum ?? Parce que là, c'est le forum C++, donc je t'ai donné des solutions par rapport à ce langage ! Bon, le principe général reste valable, bien entendu, mais la manière d'effectuer une requête HTTP n'est plus du tout la même.

En PHP, tu as d'autres contraintes et limitations, et là, je ne saurais trop t'encourager à aller voir le forum PHP pour voir si tu ne te diriges pas vers un mur.

**katcha95** · 13/02/2010, 23h26

Je peux très bien le faire en C/C++, mais l'AJAX et le XmlHttpRequest sont 2 choses totalement nouvelles pour moi. Je gagnerais du temps à faire des petis script PHP pour m'initier à la base...

**Mac LAK** · 14/02/2010, 00h11

OK, je comprends mieux... Bien que ce ne soit absolument pas différent, je le répète, d'une requête HTTP normale, donc tu peux réutiliser le code que tu as actuellement en C/C++ pour charger / analyser tes pages HTML (au prix d'une légère adaptation bien sûr).

Bon courage pour la suite !

**katcha95** · 14/02/2010, 13h40

Salut,

Bon, j'ai essayé de simuler une requête http avec : https://www.docmorris.de/docmorris/p...8812051&page=1

Pour tomber sur ma page code source contenant mes infos, et récupérer le tous, mais le problème c'est que les valeurs:
-> n02?_r_
-> baseId
changent à chaque nouvelle recherche....Comment récupérer cette même page avec une série de PZN Number différents ?

**Mac LAK** · 14/02/2010, 16h11

Sauf que tu n'en a rien à fou.... de ces paramètres...

Essaie cette URL : https://www.docmorris.de/docmorris/p...ghtPzn=8812051

Comme tu le vois, j'ai viré les éléments de session. Et tu sais quoi ? Ben ça marche quand même, il renvoie les valeurs quoi qu'il en soit... Le paramètre highlightPzn est également optionnel, on peut le virer comme les autres. Le seul qui soit réellement important, c'est le paramètre "baseId".

**katcha95** · 14/02/2010, 18h50

Encore merci pour ton aide. Juste une chose, justement base_iD est une valeur qui change, donc je reviens à mon problème.

**katcha95** · 14/02/2010, 19h10

J'ai aussi vu qu'il est possible de tomber sur ta page avec pour paramètre juste la valeur baseId, donc chaque PZN Number est relié à un ID différent dans la base de donnés du site Docmorris. Je pense que c'est impossible de pouvoir tomber sur la page contenant mes infos sans ces ID la avec un PZN différent

Parsing de page Javascript.

C++

Discussions similaires

Partager

Partager