Inclure Javascrpit dans HttpServeur

**FLIGHTWARS** · 24/02/2015, 13h07

Bonjour à tous !

Tout d'abord j'espère que je poste bien dans la bonne section du forum et si ce n'est pas le cas merci de ne pas taper :p

J'aimerais créer un serveur HTTP via Java pour pouvoir afficher des informations en temps réel extraites d'une base de données SQL, et ce par l’intermédiaire de la librairie Javascript Highcharts (qui permet de faire de jolis graphiques).

Après avoir essayé de créer un serveur en Java grâce à SimpleFrameWork, j'ai opté pour HttpServer qui semblait être plus connu et offrait une meilleure documentation sur Internet.

Le code que j'ai est le suivant:

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
 
import java.io.IOException;
import java.io.OutputStream;
import java.net.InetSocketAddress;
 
import com.sun.net.httpserver.Headers;
import com.sun.net.httpserver.HttpExchange;
import com.sun.net.httpserver.HttpHandler;
import com.sun.net.httpserver.HttpServer;
 
public class HttpServ {
 
    public static void main(String[] args) throws Exception {
        HttpServer server = HttpServer.create(new InetSocketAddress(8000), 0);
        server.createContext("/test", new MyHandler());
        server.setExecutor(null); // creates a default executor
        server.start();
    }
 
    static class MyHandler implements HttpHandler {
        public void handle(HttpExchange t) throws IOException {
            String response = "This is the response : COUCOU !!!";
            Headers headers = t.getResponseHeaders();
            headers.add("Content-Type", "application/atom+xml");
            t.sendResponseHeaders(200, 0);
            t.sendResponseHeaders(200, response.length());
            OutputStream os = t.getResponseBody();
            os.write(response.getBytes());
            os.close();
        }
    }
 
}

Lorsque j’exécute le programme et me connecte à l'adresse http:127.0.0.1:8000/test la page est bien affichée. Donc de ce côté là ça fonctionne.

Par contre lorsque j'essaye de modifier le champ head, j'ai une page blanche. Et ce champ head j'aimerais pouvoir le modifier car ce dernier doit contenir le code suivant pour pouvoir afficher le graphique Highcharts:

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
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>Highcharts Example</title>
 
		<script type="text/javascript" src="C:\Users\PC-Voix\Desktop\testJcharts\NEW\Highcharts-4.1.1\examples\pie-basic\jquery-1.11.2.min.js"></script>
		<style type="text/css">
${demo.css}
		</style>
		<script type="text/javascript">
$(function () {
    $('#container').highcharts({
        chart: {
            type: 'bar'
        },
        title: {
            text: 'Utilisation des Liens'
        },
        xAxis: {
            categories: ['Ethernet', 'GSM', 'T2', 'VHF', 'VLF']
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Affichage Temps-Reel'
            }
        },
        legend: {
            reversed: true
        },
        plotOptions: {
            series: {
                stacking: 'normal'
            }
        },
colors: ['#2ecc71','#e74c3c','#2c3e50'],
        series: [{
            name: 'Free',
            data: [5, 3, 4, 7, 2]
        }, {
            name: 'Buzzy',
            data: [2, 2, 3, 2, 1]
        }, {
            name: 'HS',
            data: [3, 4, 4, 2, 5]
        }]
    });
});
		</script>

`

Ma question est donc : ''Comment peut-on faire pour modifier le champ Head et insérer ce code Javascript ?'', ou plus simplement comment insérer du Javascript dans HttpServer?

Par avance je vous remercie de l'aide que vous pourrez m'apporter,
Cordialement,
FLIGHT'

**joel.drigo** · 24/02/2015, 14h11

Salut,

A priori, si dans l'outputStream que tu récupères par t.getResponseBody(), tu écris ton html, et que tu changes ton content-type en text/html, la page devrait s'afficher dans le navigateur.

Ensuite, il faudrait modifier l'URL du javascript dans la page, pour que ça repointe vers ton serveur (un chemin relatif à un dossier accessible par le serveur). Et dans ta classe MyHandler tu testes si, l'url se termine par .js, tu renvoies le contenu du fichier complet correspondant à l'url passée.

De manière générale, tu peux gérer dans ton handler un système capable soit de renvoyer dans le stream systématique le contenu d'un fichier lorsque l'URL correspond à un fichier dans un dossier local de ton serveur, sinon autre chose (tu peux parser l'URL et l’interpréter comme tu veux). Il faut juste que le content-type soit reconnaissable par le navigateur (donc un mimetype standard) pour ce qui doit être traité par le navigateur. Par exemple, si tu écris dans le flux le contenu d'un fichier png, il faudra mettre image/png.

**FLIGHTWARS** · 24/02/2015, 15h01

Salut Joel,

Merci pour cette réponse rapide !

Alors si j'ai bien compris ce qui est envoyé au client c'est le t.getResponseBody() qui lui contient l'outputStream qui ''contient'' le fichier html?

Par contre je n'ai pas trop compris ce que tu voulais dire dans ton deuxième paragraphe. Qu'entends tu par modifier l'URL du javascript dans la page?
Et pourquoi tester si l'URL se termine par .js ? ^^ (en fait j'ai juste mis le code de mon head qui représente en fait 98% de mon fichier .htm xD).

Alors concrètement on va faire en sorte de juste renvoyer le contenu d'un fichier (présent sur notre serveur Java) au client, de telle sorte que l'on aura pas besoin de se soucier de ce qu'il y a dans le header ou dans le body?

Désolé pour toutes mes questions, mais je débute en Java et j'ai pas encore trop l'habitude (voir pas du tout x) ) de ce langage.

Par avance je te remercie pour ta réponse,
Cordialement,
FLIGHT'

**joel.drigo** · 24/02/2015, 15h25

Envoyé par FLIGHTWARS

Salut Joel,

Merci pour cette réponse rapide !

Alors si j'ai bien compris ce qui est envoyé au client c'est le t.getResponseBody() qui lui contient l'outputStream qui ''contient'' le fichier html?

C'est une requête http qui est échangée entre le navigateur est le serveur : elles est composée d'un header et d'un body. L'outputStream permet d'écrire dans le body : le navigateur exploite le body grâce au contentType, qui lui dit ce que ce c'est, ce qui lui permet de savoir comment le traiter.

Envoyé par FLIGHTWARS

Par contre je n'ai pas trop compris ce que tu voulais dire dans ton deuxième paragraphe. Qu'entends tu par modifier l'URL du javascript dans la page?
Et pourquoi tester si l'URL se termine par .js ? ^^ (en fait j'ai juste mis le code de mon head qui représente en fait 98% de mon fichier .htm xD).

Dans ton html, il y a :

Code html :

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

<script type="text/javascript" src="C:\Users\PC-Voix\Desktop\testJcharts\NEW\Highcharts-4.1.1\examples\pie-basic\jquery-1.11.2.min.js"></script>

C'est une balise qui définit un javascript qui se trouve dans un fichier externe. Le chemin du dossier est un chemin absolu, qui n'a aucun sens pour le client, puisque c'est un dossier du serveur (sauf si client et serveur sont la même machine, mais c'est un cas particulier : autant gérer le cas général). Donc je parlais d'y mettre un chemin relatif que ton handler va utiliser pour déterminer le chemin absolu, et écrire le js dans le body.

Envoyé par FLIGHTWARS

Alors concrètement on va faire en sorte de juste renvoyer le contenu d'un fichier (présent sur notre serveur Java) au client, de telle sorte que l'on aura pas besoin de se soucier de ce qu'il y a dans le header ou dans le body?

Donc, l'idée c'est d'envoyer un html au client (enfin pas vraiment envoyé, c'est la réponse en retour de la requête http du client) : cet html va être interprété par le client (le navigateur), et il va charger automatiquement certaines url qui s'y trouve (celle qu'il y a dans src, de la balise SCRIPT, ou IMG, par exemple...)

Envoyé par FLIGHTWARS

Désolé pour toutes mes questions, mais je débute en Java et j'ai pas encore trop l'habitude (voir pas du tout x) ) de ce langage.

Ça n'a rien à voir avec Java en fait. C'est intéressant et formateur de faire un serveur http en Java. Mais il faut connaitre un peu les bases de http, html, etc... Dis-moi, tu fais un serveur perso pour le fun, ou c'est dans le but de faire une application web ? Parce que sinon il existe des conteneurs de servlet ou serveurs d'application déjà tout fait, et qui gère tout ça de manière infiniment plus robuste et scalable que ce tu pourras faire, du moins, sans y passer un certain temps. Parce que si tu débutes en Java, tu risques de passer à côté d'autres concepts : je ne sais pas si ta bibliothèque HttpServer gère par exemple le multithread, mais c'est une notion importante, ou, je pense aussi rien qua la notion de session...

**FLIGHTWARS** · 24/02/2015, 16h17

Merci pour les explications, c'est un peu plus clair mais je patauge toujours :/

En fait je fais ce programme dans le cadre de mon alternance.
Des données sont récupérées en Java et sont envoyées vers une base SQL.
Ce que j'aimerais faire ensuite c'est récupérer ces données et les mettre en forme grâce à des graphiques (bien plus parlant que des chiffres ^^), pour pouvoir afficher cette page html sur un serveur de monitoring que j'ai monté.

Du coup il ne serait pas possible de juste possible de balancer au client le contenu de ma page htm qui contient le header et le body?
Et le lien de la source javascript sera un lien sur le serveur que le client pourra aller chercher comme ça la page sera correctement affichée?

FLIGHT'

**joel.drigo** · 24/02/2015, 16h32

En gros, tu veux afficher des graphiques dans un navigateur web, avec une application en java qui les génèrent à partir de données récupérées dans une base de données.

Tu peux faire ça avec une servlet standard, voire une simple JSP, hébergée par un tomcat. Pas besoin de t'embêter à faire un serveur http pour ça. C'est quoi ton "serveur de monitoring", ce n'est pas déjà un serveur web ?

Ensuite,

Envoyé par FLIGHTWARS

Du coup il ne serait pas possible de juste possible de balancer au client le contenu de ma page htm qui contient le header et le body?
Et le lien de la source javascript sera un lien sur le serveur que le client pourra aller chercher comme ça la page sera correctement affichée?

C'est bien ça dont je te parles. Mais le chemin vers le javascript est un chemin absolu dans le filessytem a machine serveur, dans le html que tu montres. Or le client, en général, ce n'est pas le serveur : il n'a donc pas accès à ce fichier par ce chemin absolu. Tu pourrais copier tous le javascript dans la balise scrip, mais ça va être galère, pour pleins de raisons que je vais éluder volontairement.

**FLIGHTWARS** · 24/02/2015, 17h00

En gros, tu veux afficher des graphiques dans un navigateur web, avec une application en java qui les génèrent à partir de données récupérées dans une base de données.

Oui c'est exactement ça

Tu peux faire ça avec une servlet standard, voire une simple JSP, hébergée par un tomcat. Pas besoin de t'embêter à faire un serveur http pour ça. C'est quoi ton "serveur de monitoring", ce n'est pas déjà un serveur web ?

C'est un serveur sous Nagios et oui c'est déjà un serveur web. Mais l'idée est de pouvoir avoir une solution ''portable'' et que l'on ne soit pas obligé de déployer ce serveur de monitoring juste pour avoir ces données d'utilisation.

La solution avec le Java aurait permit d'avoir une seule application qui fait tout. Après si tes idées le permettent aussi je suis preneur

C'est bien ça dont je te parles. Mais le chemin vers le javascript est un chemin absolu dans le filessytem a machine serveur, dans le html que tu montres. Or le client, en général, ce n'est pas le serveur : il n'a donc pas accès à ce fichier par ce chemin absolu.

D'accord en fait je pensais ça car de base les sources pour les paquages javascript sont accessibles par un lien :

ex:

Code :

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

<script src="http://code.highcharts.com/highcharts.js"></script>

Mais comme mon serveur n'a pas d'accès vers Internet j'ai DL les paquages nécéssaires et je pensais faire pareil du coup?
Serait-il possible de le mettre le fichier dans le programme Java (dans les sources) et qu'il renvoie son contenu? (Ah ouais nan du coup le client ne pourras toujours pas aller chercher les sources...).

Code :

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

Tu pourrais copier tous le javascript dans la balise scrip, mais ça va être galère, pour pleins de raisons que je vais éluder volontairement.

C'est clair ça va être un bor#el pas possible avec tous les quotes et doubles quotes, caractères d'échappement xD

FLIGHT'

**joel.drigo** · 24/02/2015, 17h21

Envoyé par FLIGHTWARS

Oui c'est exactement ça

C'est un serveur sous Nagios et oui c'est déjà un serveur web. Mais l'idée est de pouvoir avoir une solution ''portable'' et que l'on ne soit pas obligé de déployer ce serveur de monitoring juste pour avoir ces données d'utilisation.

La solution avec le Java aurait permit d'avoir une seule application qui fait tout. Après si tes idées le permettent aussi je suis preneur

Mais tu parles d'aller chercher des données dans une base ? Donc elle faut qu'elle soit accessible : si elle est accessible, le serveur nagios aussi. Mais, bon, peut-être qu'il s'agit extraire les données et de pouvoir les consulter en mode déconnecté.

Envoyé par FLIGHTWARS

D'accord en fait je pensais ça car de base les sources pour les paquages javascript sont accessibles par un lien :

ex:

Code :

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

<script src="http://code.highcharts.com/highcharts.js"></script>

Ok, si toutes tes bibliothèques sont accessibles en ligne, c'est une solution (il faut être quand même connecté sur Internet). Mais je vois que le chemin qui est dans ton html, c'est un lien vers le jar min de jquery. Lui aussi est accessible en ligne.

Envoyé par FLIGHTWARS

Mais comme mon serveur n'a pas d'accès vers Internet j'ai DL les paquages nécéssaires et je pensais faire pareil du coup?
Serait-il possible de le mettre le fichier dans le programme Java (dans les sources) et qu'il renvoie son contenu? (Ah ouais nan du coup le client ne pourras toujours pas aller chercher les sources...).

Tu parles de les installer sur chaque client ? En fait, tu veux faire un serveur web qui tourne sur le client ? Même dans ce cas, il vaut mieux être en relatif : on ne sait jamais (avoir des chemins absolus en dur peut-être problématique sur certaines config, et ça ne coûte pas grand chose faire du relatif, même avec un serveur fait soi-même. [EDIT] Et je les mettrais dans le jar, personnellement, ça te facilitera le déploiement : tu n'auras qu'un fichier et il pourra être mis n'importe où.

Complètement déconnecté ?
Dans ce cas, autant faire une génération automatiquement qui créés des fichiers dans un dossier (un site statique). Pas besoin d'application Java pour consulter (juste pour générer).
Déconnecté d'un serveur web en ligne, mais connecté à un SGBD en direct (en JDBC) ?
Très dangereux, à moins que ton client et ton serveur sont toujours dans le même réseau local bien sécurisé. En général, on accède plutôt à web service sur un serveur web, qui accède à la base. Pour peu qu'il s'agisse de la base de NAGIOS, et il vaudrait mieux éviter le faire (je suppose que NAGIOS offre des services d'accès aux données ?).

Cela dit même sans installer de serveur tomcat (ce qui peut être lourd sur une machine d'utilisateur final), tu peux embarquer un serveur web dans ton application Java, comme jetty par exemple, qui est suffisamment robuste pour ce que tu veux faire et tu ne seras pas obligé de refaire ton propre serveur. [EDIT]Mais si c'est limité vraiment qu'à une seule page, effectivement ta classe suffira : et il suffit de faire comme je t'ai dit (au lieu d’aller cherche le fichier js sur le disque, tu vas le chercher dans le classpath avec un Class.getResource(). Après, il y a l'accès DB qui est un autre problème.

**FLIGHTWARS** · 25/02/2015, 09h37

Salut

Mais tu parles d'aller chercher des données dans une base ? Donc elle faut qu'elle soit accessible : si elle est accessible, le serveur nagios aussi.

Alors l'idée c'est que le Nagios et cette application soient séparées pour diverses raisons, donc l'appli Java serait installée (ou du moins probablement) sur une VM dédiée.

Tu parles de les installer sur chaque client ? En fait, tu veux faire un serveur web qui tourne sur le client ?

Non juste sur le serveur ^^
En fait j'ai DL les sources pour pouvoir générer les pages car cette application sera mise en production sur un réseau n'ayant aucun accès à l'Internet.
Les sources seront sur le serveur après où? c'est une bonne question, mais il faut que n'importe qui (ou presque) puisse accéder au site qui contient les graphs des statistiques.

Et je les mettrais dans le jar, personnellement, ça te facilitera le déploiement : tu n'auras qu'un fichier et il pourra être mis n'importe où.

Okay je serais d'accord si cela permet une exportation plus aisée de l'application

Déconnecté d'un serveur web en ligne, mais connecté à un SGBD en direct (en JDBC) ?

Oui c'est plutôt ça je crois...
Déconnecté du net, mais connecté à un serveur SQL (d'ailleurs on pourrait peut-être même mettre ce serveur SQL sur la même VM que l'app Java).

Cela dit même sans installer de serveur tomcat (ce qui peut être lourd sur une machine d'utilisateur final), tu peux embarquer un serveur web dans ton application Java, comme jetty par exemple, qui est suffisamment robuste pour ce que tu veux faire et tu ne seras pas obligé de refaire ton propre serveur. [EDIT]Mais si c'est limité vraiment qu'à une seule page, effectivement ta classe suffira : et il suffit de faire comme je t'ai dit (au lieu d’aller cherche le fichier js sur le disque, tu vas le chercher dans le classpath avec un Class.getResource(). Après, il y a l'accès DB qui est un autre problème.

Voilà un serveur web dans le Java serait l'idéal.
Après il sera peut-être nécessaire de faire plusieurs pages mais cela ne doit pas être un problème, si ?

D'accord donc pour résumer le plus simple serait de mettre le fichier htm dans les sources de l'application Java?
Et ce fichier contiendra des variables qui pourront être modifiées par Java pour afficher les données que je souhaite.

Lorsque qu'un client se connectera, l'application Java enverra/affichera la page html au client.

J'ai l'impression que ce n'est pas très clair mon histoire là xD

Merci pour ton aide

**joel.drigo** · 25/02/2015, 09h45

Donc, ce qu'il te faut simplement, c'est un Tomcat sur le serveur, avec les fichiers html, jsp et javascript dans le dossier de la webapp, avec quelques classes pour l'interface avec la base de données. Pas besoin de développer ton propre serveur http. Et, du coup, il n'y a pas d'application Java à distribuer sur les postes clients. Les utilisateurs se connectent via leur navigateur web.

**FLIGHTWARS** · 25/02/2015, 14h58

Super idée pour le serveur TomCat ça fonctionne nickel merci !

Par contre ça m'affiche bien la page "statique" mon html mais comment faire pour avoir des variables dans se html? j'ai vu qu'il y avait du JSON etc j'ai essayé mais j'y comprend rien xD

**joel.drigo** · 25/02/2015, 15h25

Le JSON est une très bonne idée : et ce n'est pas bien compliqué en fait. C'est juste un format de description de données dans un texte.

tutoriel JSON
Ensuite il te suffit de faire une classe qui va chercher les données dans la base et construits le JSON, par "concaténation" (avec un StringBuilder), ou en utilisant une bibliothèque dédie comme jackson par exemple.

Mais tu peux aussi directement construire ton graphique avec ses données dans une JSP. Une JSP c'est un fichier texte dans le dossier de l'application web, et mélange du java, du html, du javascript, de la css, et quelques balises spéciales qui permettent d'y mettre directement du code Java. Tutoriel ici.
Un principe de base que tu peux appliquer pour construire la JSP :

fait un html qui affiche tes graphiques à partir de données statiques
renomme ce fichier en jsp (change le .html (ou .htm) en .jsp)
ça marche déjà comme une jsp
entoure la partie avec le <% devant et %> derrière, ou les données sont tapées en dur (je ne sais quelle représentation elles ont dans ta bibliothèque de graphiques, mais c'est probablement un tableau, ou un json peut-être)
écrit à part une simple classe Java avec une seule méthode main,
- écrit une méthode qui simule la récupération des données depuis ta base, dans le format qui t'arrange (format = des classes, des listes, des maps, que sais je)
- dans la méthode main appelle cette méthode et écrit le code qui les utilise pour écrire dans la console (donc avec System.out) les données au format que tu as en dur dans le html (le truc qu'on a entouré de <% et %>, donc peut-être un tableau (si c'est un json : utilise jackson pour générer une String que tu écris dans la console)
remplace dans la jsp le code qu'il y entre <% et %> par le code de ta méthode main() de cette petite classe qu'on vient de faire. Remplaces-y tous les System.out par out (ou enlève System. si tu préfères)
reste à faire le branchement avec la vraie classe d'accès aux données de la base et c'est fini. Pour ça, je ne sais pas quelles connsaissances tu as de JDBC (regarde éventuellement ce tutoriel) et celui-là peut-être aussi (dans celui-là exemple donné est fait à partir de Servlet, une sorte de version pure Java de la JSP, mais le principe est un peu le même : d'ailleurs tu peux faire une Servlet au lieu d'une JSP : la différence, c'est qu'on ne peut pas y mettre de l'html directement, puisque c'est du Java. Tout la partie html/javascript/css doit être écrite sous forme de texte via un out (comme on le ferait avec System.out pour écrire dans la console), et le reste c'est du java (donc ce qu'il y a entre <% et%> reste identique.

**FLIGHTWARS** · 25/02/2015, 23h06

Ummm d'accord je vois

Du coup j'ai essayé avec le fichier JSP mais je n'y arrive pas :/

Serait-il possible d'avoir un exemple ''concret''?

J'ai la classe suivante:

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
import java.util.Arrays;
 
public class SimpleClass {
 
	private static String[] type = {"'IP002'", "'GSM'", "'T2'", "'VHF'", "'TOTO'"};
 
	public static String[] returnType () {
		return type;
 
	}
 
 
	public static void main(String[] args) {
		// TODO Auto-generated method stub
		System.out.println(Arrays.toString(returnType()));
 
	}
 
}

Et je souhaiterais modifier le champ "catégorie" par exemple:

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
%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!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=utf-8">
		<title>Highcharts Example</title>
 
		<script type="text/javascript" src="jquery-1.11.2.min.js"></script>
		<script type="text/javascript" src="highcharts.js"></script>
		<style type="text/css">
${demo.css}
		</style>
		<script type="text/javascript">
$(function () {
    $('#container').highcharts({
        chart: {
            type: 'bar'
        },
        title: {
            text: 'Utilisation Faisceaux'
        },
        xAxis: {
            categories: <%type%>
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Occupation des faisceaux en temps réel'
            }
        },
        legend: {
            reversed: true
        },
        plotOptions: {
            series: {
                stacking: 'normal'
            }
        },
colors: ['#2ecc71','#e74c3c','#2c3e50'],
        series: [{
            name: 'Free',
            data: [5, 3, 4, 7, 2]
        }, {
            name: 'Buzzy',
            data: [2, 2, 3, 2, 1]
        }, {
            name: 'HS',
            data: [3, 4, 4, 2, 5]
        }]
    });
});
		</script>
	</head>
<body>
 
<script src="../../js/highcharts.js"></script>
<script src="../../js/modules/exporting.js"></script>
 
<div id="container" style="min-width: 310px; max-width: 800px; height: 400px; margin: 0 auto"></div>
 
 
</body>
</html>

Comment faut-il faire ? x)

Par avance je te remercie pour ta réponse

Cordialement,
FLIGHT'

**joel.drigo** · 25/02/2015, 23h38

Donc tu veux rendre dynamique cette partie :

Code html :

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

categories: ['Ethernet', 'GSM', 'T2', 'VHF', 'VLF']

A partir d'une classe où les catégories se trouvent. Oublie les méthodes static déjà :

Code :

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

1
2
3
4
5
6
7
8
9
10
package net.developpez; // c'est un exemple, tu mettras ce que tu veux
public class GraphicData {
 
    private String[] categories = {"'IP002'", "'GSM'", "'T2'", "'VHF'", "'TOTO'"};
 
   public String[] getCategories() {
        return categories;
   }
 
}

dans le fichier jsp, on va l'instancier (c'est une version temporaire de simulation, parce qu'au final tu iras chercher des données dans une base, donc tu passeras par une classe qui produira l'objet à partir de données de la base.)

Il faut, comme dans une classe Java, importer les classes qu'on utilise. Pour faire ça on utilise :
<%@ page import="net.developpez.GraphicData" %>
(il y a une autre syntaxe, mais tu verras ça peut-être une autre fois)
tu mets ça donc au début de ton fichier jsp :

Code jsp :

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

1
2
3
4
5
6
 
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="net.developpez.GraphicData" %>
 
... etc

Ensuite on va donc créer une instance :pour mettre du code java dans une jsp, on l'entoure de <% et %>

Code jsp :

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

1
2
3
4
5
6
 
...
<% GraphicData data = new GraphicData(); %>
$(function () {
    $('#container').highcharts({
...

Ensuite on a donc besoin de mettre ces valeurs à la place de ce qu'il y a en dur ici :

Code html :

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

1
2
3
        xAxis: {
            categories: ['Ethernet', 'GSM', 'T2', 'VHF', 'VLF']
        },

On a la possibilité de le faire complètement en java, donc entre <% %>

Code jsp :

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

1
2
 
            categories: [<% // ici donc il faut mettre le code java qui écrit à partir du tableau de catégorie l'équivalent de ce qu'on a en dur dans le html %>]

le code Java qu'on écrirait pour sortie ça en console en pur Java pourrait être :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
boolean first=true;
for(String category : data.getCategories() ) {
    if( first ) {
      first=false;
    }
    else [
       System.out.print(", ");
    }
    System.out.print("'");
    System.out.print(category);
    System.out.print("'");
}

Maintenant je t'ai de prendre ce code et de remplacer les System.out par out, ce qui donne :

Code jsp :

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

1
2
3
4
5
6
7
8
9
10
11
12
boolean first=true;
for(String category : data.getCategories() ) {
    if( first ) {
      first=false;
    }
    else [
       out.print(", ");
    }
    out.print("'");
    out.print(category);
    out.print("'");
}

puis de le mettre entre les <% %> :

Code jsp :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
            categories: [<% 
                                   boolean first=true;
                                   for(String category : data.getCategories() ) {
                                      if( first ) {
                                         first=false;
                                      }
                                      else [
                                         out.print(", ");
                                      }
                                      out.print("'");
                                      out.print(category);
                                      out.print("'");
                                  }
                            %>]

Il y a une autre manière de mélanger du Java dans la jsp, mais c'est un peu plus verbeux dans ce cas (dans d'autres ça pourra être plus interessant) : en fait tout ce qui sous la forme out.print( xxx ) peut être écrit sous la forme <%= xxx %> quand xxx est une expression Java qui a une valeur(comme une variable, ou un appel de méthode, ou un new Machin(), etc.), et par xxx directement quand xxx est du texte (entre double-quote). bien sûr cette expression doit être mis en dehors du code java (puisque ça compile pas ça en java), donc il faut fermer le bloc java avant par %> et le réouvri après par <% :

Code jsp :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
            categories: [<% 
                                   boolean first=true;
                                   for(String category : data.getCategories() ) {
                                      if( first ) {
                                         first=false;
                                      }
                                      else [
                                         %>, <% // ici la virgule c'est du texte, donc pas de <%= %>
                                      }
                                      %>'<%
                                      %> <%= category %> <% // la category est une variable donc il faut la mettre entre <%= %>
                                      %>'<%
                                  }
                            %>]

quand on a <% et %> sans rien d'autre que des espaces entre, c'est qu'on a du code java vide, donc qui ne fait rien, donc qu'on peut enlever. donc on peut simplifier en

Code jsp :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
            categories: [<% 
                                   boolean first=true;
                                   for(String category : data.getCategories() ) {
                                      if( first ) {
                                         first=false;
                                      }
                                      else [
                                         %>, <% // ici la virgule c'est du texte, donc pas de <%= %>
                                      }
                                      %>'<%= category %>'<%
                                  }
                            %>]

**FLIGHTWARS** · 01/03/2015, 21h08

Salut !

J'ai pu essayer ta méthode en modifiant le code avec les balises <%...%> et ça fonctionne nickel !

Maintenant j'ai une page dynamique et ça rend super bien grâce à toi !

Merci encore pour ton aide,
Cordialement,
FLIGHT'

Inclure Javascrpit dans HttpServeur

Java

Discussions similaires

Partager

Partager