Récupérer le contenu d'une page web

**cactus68100** · 11/03/2015, 16h10

Bjr à tous,

je ne connait absolument pas javascript mais je dois l'utiliser pour le problème suivant :

- sur un raspberry j'ai installé transmission et j'utilise le webui.
- transmission est lié a openVPN
- la page index.html fait appel à pas mal de scripts javascript que je ne compte absolument pas toucher.
- par contre, j'ai rajouté un div sur la page index et j'aimerais lorsqu'on clique dessus que la page aille se loguer à une adresse précise qui lui transmet son ip (l'ip du serveur transmission, donc).

index.html de transmission IP ? --------> page php externe (dont je connais l'adresse) qui lui passe l'adresse IP : print$_SERVER['REMOTE_ADDR']

il faut donc que je me connecte à cette page php externe et que j'affiche l'adresse IP.
SVP quelqu'un pourrait-il m'aider ?
sinon, transmission utilisant rpc, comment incorporer le PHP ? (ce serait plus simple pour moi)

voilà le début de la page index.html (voir dans body "c'est ici que je commence")

Code html :

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
<!DOCTYPE html>
<html>
	<head>
		<!--<meta http-equiv="Refresh" content="30; url="index.html">-->
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=8,IE=9"><!-- ticket #4555 --> 
		<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<link href="./images/favicon.ico" rel="icon" />
		<link href="./images/favicon.png" rel="shortcut icon" />
		<link rel="apple-touch-icon" href="./images/webclip-icon.png"/>
		<script type="text/javascript" src="./javascript/jquery/jquery.min.js"></script>
		<script type="text/javascript" src="./javascript/jquery/jqueryui-1.8.16.min.js"></script>
		<link rel="stylesheet" href="./style/jqueryui/jqueryui-1.8.16.css" type="text/css" media="all" />
<!--
		<link media="screen" href="./style/transmission/mobile.css" type= "text/css" rel="stylesheet" />
-->
		<link media="only screen and (max-device-width: 480px)" href="./style/transmission/mobile.css" type= "text/css" rel="stylesheet" />
		<link media="screen and (min-device-width: 481px)" href="./style/transmission/common.css" type="text/css" rel="stylesheet" />
		<!--[if IE 8]>
		<link media="screen" href="./style/transmission/common.css" type="text/css" rel="stylesheet" />
		<![endif]-->
		<script type="text/javascript" src="./javascript/jquery/jquery.transmenu.min.js"></script>
		<script type="text/javascript" src="./javascript/jquery/jquery.contextmenu.min.js"></script>
		<script type="text/javascript" src="./javascript/jquery/jquery.form.min.js"></script>
		<script type="text/javascript" src="./javascript/jquery/json2.min.js"></script>
		<script type="text/javascript" src="./javascript/common.js"></script>
		<script type="text/javascript" src="./javascript/inspector.js"></script>
		<script type="text/javascript" src="./javascript/prefs-dialog.js"></script>
		<script type="text/javascript" src="./javascript/remote.js"></script>
		<script type="text/javascript" src="./javascript/transmission.js"></script>
		<script type="text/javascript" src="./javascript/torrent.js"></script>
		<script type="text/javascript" src="./javascript/torrent-row.js"></script>
		<script type="text/javascript" src="./javascript/file-row.js"></script>
		<script type="text/javascript" src="./javascript/dialog.js"></script>
		<script type="text/javascript" src="./javascript/formatter.js"></script>
		<title>Transmission Web Interface</title>
	</head>
	<body id="transmission_body">
 
		<div id="toolbar">
			<div id="toolbar-open" title="Open Torrent"></div>
			<div id="toolbar-remove" title="Remove Selected Torrents"></div>
			<div id="toolbar-separator"></div>
			<div id="toolbar-start" title="Start Selected Torrents"></div>
			<div id="toolbar-pause" title="Pause Selected Torrents"></div>
			<div id="toolbar-separator"></div>
			<div id="toolbar-start-all" title="Start All Torrents"></div>
			<div id="toolbar-pause-all" title="Pause All Torrents"></div>
 
<!--		C'EST ICI QUE JE COMMENCE -->
 
			<div id="actual_image" title="actual_image"> <img src="./images/sync.ico"></div>
			<div id="vpn_image" title="vpn_image"> <img src="./images/vpn.ico"></div>
			<div id="ext_vpn" title="ext_vpn"> <h3>logué </h></div>
			<div id="ip_image" title="ip_image"> <img src="./images/ip.ico"></div>
			<div id="extip" title="eip" widht="30" height="50" src="monip.htm"><h3>192.168.0.235</h></div>
 
			<div id="toolbar-inspector" title="Toggle Inspector"></div>
 
		</div>
 
		<div id="statusbar">
			<div id='filter'>
				Show
				<select id="filter-mode">
					<option value="all">All</option>
					<option value="active">Act

**Watilin** · 11/03/2015, 19h17

Je sais pas si j'ai bien compris ton problème… Déjà tu pourrais appeler la page PHP avec une iframe pour voir si la communication se fait bien.

Dans ta div :

Code HTML :

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

<iframe width="400" height="100" src="adresse_de_la_page.php"></iframe>

Si ça marche, tu pourrais la remplacer par un bout de script qui fait un appel Ajax et qui place le résultat dans ta div.

Code JS :

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

1
2
3
4
5
6
7
8
9
10
11
12
var xhr = new XMLHttpRequest();
xhr.open("GET", "adresse_de_la_page.php");
xhr.onreadystatechange = function() {
   if (this.readyState < 4) return;
   if (this.status !== 200) {
      console.log("erreur réseau : " + this.status + " " + this.statusText);
   } else {
      document.getElementById("la-div")
         .appendChild(document.createTextNode(this.responseText));
   }
};
xhr.send();

Au besoin remplace console.log par alert vu que je ne sais pas quel navigateur tu utilises sur ton Rasp.

En fait tu peux aussi te servir de ce bout de code pour voir ce qui ne va pas si l'iframe n'a pas marché. Le code HTTP te sera utile. Par exemple tu pourrais te prendre une 409, c'est arrivé à d'autres. Et si le code est 0, ça veut dire que la requête a été bloquée par ton navigateur.

**cactus68100** · 12/03/2015, 10h55

Merci... je vais voir ça...

**cactus68100** · 12/03/2015, 13h23

Re - bjr

J’ai essayé xmlhttprequest ça fonctionne très bien, sauf qu’il me retourne l’ip locale du client et non du serveur (logique).

J’ai donc créer un script bash qui teste l’ip du serveur transmission et le stoque dans un fichier, puis j'utilise xmlhttprequest pour charger l’ip et l'afficher dans une div. Ça fonctionne très bien sauf si le client est sous Android.

Xmlhttprequest ne semble pas fonctionner tel quel Sur android. Quelqu’un à une idée ?

Encore une question : j'essaye de tester la réponse que j’ai mis dans une variable mais ça ne fonctionne pas :

Code :

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

1
2
3
If (top == '192.168.0.254') {
    document.getElementById('id_de_l’icone').innerHTML = ’src="chemin_icone"'
}

si l’ip est Ok on met l'icône verte et on affiche l’ip (... INNERHTML = tmp) (avec l’ip de la div de l’ip) sinon on met la rouge.
Peut être en mettant src=.... dans une variable ?

Cactus

**Watilin** · 17/03/2015, 15h15

Re,

Envoyé par cactus68100

J’ai essayé xmlhttprequest ça fonctionne très bien, sauf qu’il me retourne l’ip locale du client et non du serveur (logique).

Est-ce que tu as essayé $_SERVER['SERVER_ADDR'] ? (liste des valeurs de $_SERVER).

Note à part : à ma connaissance, c'est bien le navigateur qui fait les requêtes DNS pour convertir les noms de domaine en adresses IP, mais il fait rapidement abstraction de l'IP et les couches supérieures (hypertexte, JavaScript) ne travaillent qu'avec les domaines, donc on ne « voit » jamais les IP dans le code JS.

Xmlhttprequest ne semble pas fonctionner tel quel Sur android. Quelqu’un à une idée ?

Pas moi ; espérons que tu auras une réponse dans l'autre sujet que tu as ouvert.

Encore une question : j'essaye de tester la réponse que j’ai mis dans une variable mais ça ne fonctionne pas :

Code :

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

1
2
3
If (top == '192.168.0.254') {
    document.getElementById('id_de_l’icone').innerHTML = ’src="chemin_icone"'
}

si l’ip est Ok on met l'icône verte et on affiche l’ip (... INNERHTML = tmp) (avec l’ip de la div de l’ip) sinon on met la rouge.
Peut être en mettant src=.... dans une variable ?

Cactus

Il y a trois raisons pour lesquelles ce code ne marche pas.

Comme je l'ai dit, JavaScript ne voit pas les IP.
Ensuite, tu ne peux pas comparer top, qui est une instance de Window, avec une chaîne de caractères.
Enfin, tu n'utilises pas correctement innerHTML : cette propriété agit sur les nœuds descendants (le contenu), pas sur l'élément lui-même. Une image n'ayant pas de descendants, innerHTML n'a pas d'effet. La solution est plus simple : agis directement sur l'attribut src :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
```
document.getElementById('id_de_l’icone').src = "chemin_icone";
```

Au fait, attention avec l'apostrophe typographique (’) : ce n'est pas un délimiteur en JS ; en fait c'est un caractère comme les autres. Tu ne peux pas t'en servir comme guillemet.

Récupérer le contenu d'une page web

JavaScript

Vue hybride

Discussions similaires

Partager

Partager