Différences

Ci-dessous, les différences entre deux révisions de la page.

--- meet_jitsi_docker_reverse_proxy_nginx [2023/12/03 00:37] – [Customisation] n1c0
+++ meet_jitsi_docker_reverse_proxy_nginx [2024/03/30 03:06] (Version actuelle) – [Personnaliser l'interface] Labomedia
@@ Ligne 58: / Ligne 58: @@
   TZ=Europe/Paris
   PUBLIC_URL=https://visio.mondomaine.org
+  CONFIG=/home/jitsi/.jitsi-meet-cfg
+Le dossier **.jitsi-meet-cfg** (configuré ci-dessus), accueillera la config de Jitsi exposée par le container docker.
 On génère des passwords forts, qui seront ajoutés dans le fichier .env précédent :
   ./gen-passwords.sh
-On crée le dossier recevant la config de Jitsi (en dehors du container) et tous ses sous-dossiers (remarquer que le dossier est un dossier caché : **.jitsi-meet-cfg**) :
-  mkdir -p /home/jitsi/.jitsi-meet-cfg/{web,transcripts,prosody/config,prosody/prosody-plugins-custom,jicofo,jvb,jigasi,jibri}
 Toujours depuis le dossier **docker-jitsi-meet-stable-9111**, démarrer le container :
@@ Ligne 147: / Ligne 146: @@
 server {
 	# IPv6 then IPv4
-        listen [::]:443 ssl ipv6only=on; # managed by Certbot
+        listen [::]:443 ssl;
-        listen 443 ssl; # managed by Certbot
+        listen 443 ssl;
         server_name visio.mondomaine.org;
@@ Ligne 180: / Ligne 179: @@
 	# SSL
-        ssl_certificate /etc/letsencrypt/live/visio.mondomaine.org/fullchain.pem; # managed by Certbot
+        ssl_certificate /etc/letsencrypt/live/visio.mondomaine.org/fullchain.pem;
-        ssl_certificate_key /etc/letsencrypt/live/visio.mondomaine.org/privkey.pem; # managed by Certbot
+        ssl_certificate_key /etc/letsencrypt/live/visio.mondomaine.org/privkey.pem;
-        include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
+        include /etc/letsencrypt/options-ssl-nginx.conf;
-        ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot
+        ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;
         # Logs
@@ Ligne 207: / Ligne 206: @@
         if ($host = visio.mondomaine.org) {
                 return 301 https://$host$request_uri;
-        } # managed by Certbot
+        }
 	# Everything else not expected
@@ Ligne 247: / Ligne 246: @@
   * **.jitsi-meet-cfg** : config actuelle exposée par le Docker. Attention, les fichiers sont écrasés à chaque **docker compose up -d**
-=== Modifier la config ===
+==== Modifier la config ====
 La config tient principalement en 2 fichiers :
@@ Ligne 261: / Ligne 260: @@
   * **custom-interface_config.js** : ici il faut copier/coller tout le fichier original et modifier les valeurs souhaitées.
-=== Personnaliser l'interface ===
+==== Personnaliser l'interface ====
-On va avoir besoin d'un dossier sur l'hôte qui contiendra les fichiers de l'interface ue l'on souhaite modifier. Par exemple le créer ici : **/home/jitsi/jisti-custom-web**.
+On va avoir besoin d'un dossier sur l'hôte qui contiendra les fichiers de l'interface que l'on souhaite modifier. Par exemple le créer ici : **/home/jitsi/jisti-custom-web**.
-== Le Logo ==
+=== Le Logo ===
-Pas possible de le changer dans les fichiers de config pour le moment (v.9111 de Jitsi), il faut passer par une astuce avec nginx : on redirige simplement le path du logo actuel (**images/watermark.svg**) vers un fichier sur l'hôte.
+Pas possible de le changer dans les fichiers de config pour le moment (v.2.0.9111 de Jitsi), il faut passer par une astuce avec nginx : on redirige simplement le path du logo actuel (**images/watermark.svg**) vers un fichier sur l'hôte.
 On ajoute dans le vhost nginx, après les proxy websockets :
@@ Ligne 277: / Ligne 276: @@
 }
 </code>
+=== Le Favicon ===
+Comme le logo, on crée un fichier favicon.ico, par exemple avec [[https://favicon.io/|cet outil]], et on ajoute une section dans le vhost :
+<code bash>
+# Custom Favicon
+location = /images/favicon.svg {
+        alias /home/jitsi/jitsi-custom-web/images/favicon.ico;
+}
+</code>
+De la même manière, on peut aussi remplacer :
+  * le Touch Icon : **/images/apple-touch-icon.png**
+  * Le logo Jitsi qui est utilisé lors de partage sur les réseaux sociaux : **/images/jitsilogo.png**
+=== Le design (CSS) ===
+Rien n'est prévu pour ça, il faut encore bricoler. On va remplacer le fichier CSS original par le notre, copie de cet original dans lequel on ajoute à la fin nos règles.
+Le fichier CSS de Jitsi web s'appelle **all.css** et se trouve dans le container Docker nommé **docker-jitsi-meet-stable-9111-web-1**, à cet endroit : **/usr/share/jitsi-meet/css/all.css**
+On crée un dossier CSS dans notre dossier de customisation et on y entre :
+  mkdir /home/jitsi/jitsi-custom-web/css && cd /home/jitsi/jitsi-custom-web/css
+On y copie la version originale provenant du Docker :
+  docker cp docker-jitsi-meet-stable-9111-web-1:/usr/share/jitsi-meet/css/all.css all.css
+A la fin de ce fichier, ajouter le CSS de vos rêves.
+Maintenant il faut détourner le fichier depuis le vhost nginx en y ajoutant :
+<code bash>
+# Custom CSS
+location ~ /css/all.css {
+        alias /home/jitsi/jitsi-custom-web/css/all.css;
+}
+</code>
+Et redémarrer nginx.
+===== Mise à jour =====
+Dans le dossier actuel contenant les différents dossiers créés précédemment (le dossier de Jitsi, son dossier de config et le dossier de la customisation), il faut donc :
+  * [[https://github.com/jitsi/docker-jitsi-meet/releases/latest|Télécharger la dernière version]] puis la décompresser
+  * Arrêter l'ancien container : dans le dossier de Jitsi actuel executer ''%%docker compose down%%''.
+  * Aller dans le dossier de la nouvelle version et démarrer le container avec ''%%docker compose up -d%%''
+  * Vérifier les fichiers **.jitsi-meet-cfg/web/custom-config.js** et **.jitsi-meet-cfg/web/custom-interface_config.js**, il y a peut être de nouvelles variables
+  * Pour le CSS, il faut aller re-chercher le fichier original de la nouvelle version pour y ajouter votre code personnalisé (voir la customisation CSS plus haut).
+  * Rédémarrer nginx pour le plaisir aussi