Partie 5: Mise en place du serveur web

Si ce n’est pas encore fait, je vous propose de commencer par lire la présentation générale de ce projet ici

Nous verrons d’abord l’application qui gère le back de notre site web, puis nous traiterons la partie front.

Nous traiterons ici de l’installation du serveur web qui permettra d’accéder à partir du web aux mesures de notre station météo.

Les sources sont disponibles ici, et il y aurait bien des choses à améliorer dans ce code!

Matériel nécessaire

Un serveur capable d’éxécuter:

• Un serveur web tel que Apache ou Nginx
• Une JRE 8 ou supérieure

La machine qui héberge votre base de donnée devrait être suffisante!

Installation de l’environnement

Les instructions suivantes sont valables pour debian 10, mais facilement adaptables!

Installation de la JRE

sudo apt install openjdk-11-jre

Installation de Nginx

sudo apt install nginx

Configuration de l’application back

Tout d’abord, procurez vous l’application!

Transférez l’archive sur votre serveur, et extrayez la ou vous le souhaitez.

• Le fichier jar correspond à l’application en tant que telle
• Le dossier conf contient deux fichiers que nous allons configurer

logback.xml

Remplacez les deux occurrences de “MODIFIER”

• La première correspond au chemin du fichier de log courant
  • /home/user/log.log par exemple pour logger dans votre dossier personnel
• La deuxième correspond au dossier ou seront stockés les logs archivés
  • /home/user par exemple

application.properties

Plus de choses à modifier dans ce fichier!

• server.port: Le port utilisé par le serveur. Modifiez à votre convenance
• server.ssl.key-store: Commentez cette ligne si vous ne souhaitez pas utiliser SSL plus de détail sur l’acitvation de SSL ci dessous
• server.ssl.key-store-password: Idem
• server.ssl.keyAlias: Idem
• db.url: Adaptez si votre base n’est pas locale, ou si vous avez changé le nom de la BDD
• db.username: Adaptez si vous avez changé l’utilisateur de la BDD
• db.password: Renseignez ici le mot de passe de connexion à la BDD

Précisions si vous souhaitez activer SSL

Si vous souhaitez activer SSL, il vous faudra un certificat. Vous pouvez utiliser Let’s Encrypt.

Une fois votre certificat obtenu, il vous faudra le convertir pour qu’il soit utilisable avec l’application. Cette page explique ce que vous devez faire

En résumé, vous devrez exécuter la commande suivante dans le répertoire qui contient vos certificats en modifiant “NAME” par ce que vous souhaitez

openssl pkcs12 -export -in fullchain.pem -inkey privkey.pem -out keystore.p12 -name NAME -CAfile chain.pem -caname root

Un mot de passe vous sera demandé et vous obtiendrez alors un fichier keystore.p12

Il faut ensuite modifier la configuration de notre application :

• server.ssl.key-store: Chemin vers le fichier keystore.p12
• server.ssl.key-store-password: Le mot de passe que vous avez choisi
• server.ssl.keyAlias: ce que vous avez mis à la place de “NAME”

Lancement de l’application

L’application se lance avec la commande suivante

java -jar /home/manudomo/manudomo/manudomo.jar

Vous pouvez surveiller les logs, situés dans le dossier que vous avez paramétré précédemment pour voir si tout se déroule bien

Si tout c’est déroulé comme prévu, alors votre serveur doit maintenant être en route!

Création d’un utilisateur en base de données

Pour pouvoir utiliser l’application, vous allez devoir vous connecter. Pour cela, nous allons devoir ajouter un utilisateur directement en base de données

Hashage du mot de passe

Les mots de passes doivent être hashés avec bcrypt 2a, sur 10 rounds.

Des sites internet proposent de hasher des chaînes de caractères. Soyons précautionneux, installons un paquet et faisons le nous même

sudo apt install apache2-utils

Hashons notre mot de passe, en remplacant bien sur password par votre mot de passe réel

htpasswd -bnBC 10 "" password | tr -d ':\n' | tr "$2y$" "$2a$"

Vous obtenez donc une chaîne de caractère qui devra être insérée en base de données

Insertion en base de l’utilisateur

Il va falloir insérer une ligne dans la table user, contenant votre nom d’utilisateur ainsi que votre mot de passe hashé.

Voici les commandes à exécuter pour le faire via psql, remplacez bien sur USER et HASHED PASSWORD par les valeurs adéquates!

sudo su postgres
psql
\connect manudomo
insert into "user" (username, password) values ('USER', 'HASHED PASSWORD');
\q
exit

Installation du front

Pour commencez, téléchargez l’archive!

Transférez la sur votre serveur et décompressez la à la racine de votre serveur web : /var/www/html.

Le ficher index.html doit se situer dans /var/www/html

Il nous reste à adapter la configuration en modifiant le fichier static/conf/Conf.js

Une seule variable à renseigner ici, ROOT_API. Vous devez y renseigner l’adresse de l’application back que nous avons précédemment installé.

Attention! Même si le serveur web est sur la même machine que l’application back, gardez en tête que l’adresse que vous renseignez ici sera utilisée par le navigateur de l’utilisateur. C’est à dire bien loin du serveur. Il faut donc renseigner, soit votre nom de domaine soit votre adresse IP.

Par exemple:

• https://li212.fr:8443
• http://12.34.56.789:8443

Si tout c’est bien passé, vous devriez être apte à accéder à l’application à partir d’internet!

Rendez vous sur votre nouvelle interface, appuyez sur le bouton “Login” et renseignez l’utilisateur et le mot de passe que vous avez précédemment choisi!

Conclusion

Le chemin a été long! Mais nous avons enfin rallié notre destination! D’un côté un arduino qui effectue des mesures de températures, et de l’autre, un site web qui les affiche!

Si vous rencontrez un soucis, n’hésitez pas à en parler en commentaire, ce sera l’occasion pour moi d’apporter des précisions ou des corrections!

Pour les parties suivantes, fini le web, et retour à l’électronique! Il ne nous reste qu’à ajouter des modules à notre système pour le compléter!

Le chapitre suivant, c’est par ici!