244 lines
8.8 KiB
Markdown
244 lines
8.8 KiB
Markdown
# MusicTopus
|
|
|
|
![MusicTopus](public/img/logo-large.png)
|
|
|
|
MusicTopus est une application Web (que vous pouvez auto-héberger) et un site Web (sur lequel vous pouvez créer un compte) permettant de gérer votre liste des CDs et Vinyles et de l'utiliser facilement n'importe où.
|
|
|
|
Le code source est publié sous licence libre [GNU GPL-3.0-or-later](LICENSE) et est disponible sur [git.darkou.fr](https://git.darkou.fr/dbroqua/MusicTopus).
|
|
|
|
## Utilisation
|
|
|
|
Vous pouvez librement utiliser le service en vous inscrivant sur [https://www.musictopus.fr/](https://www.musictopus.fr/).
|
|
|
|
Une fois inscrit vous pourrez saisir vos CDs et Vinyles sur votre espace personnel le tout gratuitement, sans tracker (en dehors de statistiques web via [Matomo](https://fr.matomo.org/)) et sans utilisation de vos données personnelles !
|
|
|
|
## Auto hébergement
|
|
|
|
Vous pouvez, si vous le souhaitez héberger l'application sur votre propre serveur.
|
|
|
|
### Prérequis
|
|
|
|
Il existe 2 méthodes d'installation, soit via docker soit en mode standalone.
|
|
|
|
Peu importe la méthode il vous faudra un compte sur [https://formspree.io/](https://formspree.io/) afin d'avoir une page nous-contacter fonctionnelle ou configurer le SMTP tel que défini dans la section [variables d'environnements](#env-file).
|
|
|
|
Pour la méthode docker il ne vous faudra rien de plus que `docker` et `docker-compose`.
|
|
|
|
En mode standalone il vous faudra :
|
|
|
|
- NodeJS 16.x
|
|
- Yarn
|
|
- MongoDB
|
|
|
|
Quelque que soit la méthode, la première étape est de cloner le projet :
|
|
|
|
```bash
|
|
git clone https://git.darkou.fr/dbroqua/MusicTopus.git
|
|
```
|
|
|
|
### Installation
|
|
|
|
#### Docker
|
|
|
|
Une fois le projet cloné rendez-vous dans son dossier,
|
|
|
|
```bash
|
|
cd ./MusicTopus
|
|
```
|
|
|
|
puis créez le fichier `.env` qui contiendra les variables d'environnement nécessaire au bon fonctionnement du projet ([voir à la fin pour la liste des variables](#env-file)).
|
|
|
|
Une fois votre fichier d'environnement créé vous devez copier le bon fichier `docker-compose.yml.{dev,prod}` en `docker-compose.yml` en fonction de vos choix.
|
|
|
|
La version `.dev` redémarrera à chaque changement d'un fichier `.js` alors que la version `prod` ne redémarrera pas automatiquement si vous éditez un fichier.
|
|
|
|
Vous pouvez maintenant démarrer votre environnement Docker :
|
|
|
|
```bash
|
|
docker-compose up -d
|
|
```
|
|
|
|
C'est terminé !
|
|
|
|
Le site est accessible sur [http://localhost:PORT](http://localhost:PORT).
|
|
|
|
#### Standalone
|
|
|
|
Pour la version standalone je vous conseille de faire un script embarquant les variables d'environnement que vous souhaitez modifier ([voir à la fin pour la liste des variables](#env-file)) :
|
|
|
|
```bash
|
|
#! /bin/bash
|
|
|
|
export NODE_ENV=development
|
|
export DISCOGS_TOKEN=***
|
|
|
|
# Dev
|
|
yarn watch
|
|
# Prod
|
|
yarn run:all
|
|
```
|
|
|
|
Rendez le script exécutable :
|
|
```bash
|
|
chmod +x ./run.sh
|
|
```
|
|
|
|
Puis exécutéz le :
|
|
```bash
|
|
./run.sh
|
|
```
|
|
|
|
C'est terminé !
|
|
|
|
Le site est accessible sur [http://localhost:3001](http://localhost:3001).
|
|
|
|
:information_source: Information : Vous pouvez, et vous devriez, également regarder du côté de `systemd`, `pm2` ou encore `supervisor` pour que le service démarre en même temps que votre serveur.
|
|
|
|
### Aller plus loin
|
|
|
|
MusicTopus est maintenant accessible en http sur un port custom (3001 par défaut) de votre serveur.
|
|
|
|
Nous allons voir comment rendre accessible en https avec un certificat [Let's Encrypt](https://letsencrypt.org/fr/). Pour le reverse proxy nous utiliserons [NGINX](https://nginx.org/).
|
|
|
|
Pour la suite je pars du principe que vous êtes un minimum familier avec Nginx et Let's Encrypt et que ces 2 outils sont déjà présents sur votre serveur. De plus vous avez une entrée DNS qui pointe vers votre serveur.
|
|
|
|
#### Obtenir le certificat
|
|
|
|
```bash
|
|
certbot --nginx --agree-tos --redirect --hsts --staple-ocsp --email votre@email.tld -d musictopus.fr
|
|
```
|
|
|
|
#### Créer le vhost
|
|
|
|
Pour ma part j'aime bien créer un fichier dans `/etc/nginx/sites-available` qui comporte le nom du site, ici par exemple `musictopus.fr`.
|
|
|
|
En voici son contenu :
|
|
|
|
```
|
|
upstream musictopus-proxy {
|
|
server 0.0.0.0:3001;
|
|
}
|
|
|
|
server {
|
|
listen 80;
|
|
listen [::]:80;
|
|
server_name musictopus.fr;
|
|
|
|
if ($host = musictopus.fr) {
|
|
return 301 https://$host$request_uri;
|
|
}
|
|
root /dev/null;
|
|
|
|
location /.well-known/acme-challenge/ { allow all; }
|
|
}
|
|
|
|
|
|
server {
|
|
listen 443 ssl http2;
|
|
|
|
server_name musictopus.fr;
|
|
root /srv/MusicTopus/public;
|
|
|
|
access_log /var/log/nginx/musictopus.fr-access.log;
|
|
error_log /var/log/nginx/musictopus.fr-error.log;
|
|
|
|
add_header X-Content-Type-Options nosniff;
|
|
add_header X-XSS-Protection "1; mode=block";
|
|
|
|
client_max_body_size 1m;
|
|
|
|
location / {
|
|
try_files $uri @proxy;
|
|
}
|
|
|
|
location @proxy {
|
|
proxy_read_timeout 300;
|
|
proxy_connect_timeout 300;
|
|
proxy_redirect off;
|
|
|
|
proxy_set_header X-Forwarded-Proto $scheme;
|
|
proxy_set_header Host $http_host;
|
|
proxy_set_header X-Real-IP $remote_addr;
|
|
proxy_set_header X-Forwarded-Ssl on;
|
|
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
|
|
proxy_set_header X-Frame-Options SAMEORIGIN;
|
|
|
|
proxy_pass http://musictopus-proxy;
|
|
|
|
tcp_nodelay on;
|
|
}
|
|
|
|
error_page 500 501 502 503 504 /500.html;
|
|
|
|
ssl_certificate /etc/letsencrypt/live/musictopus.fr/fullchain.pem;
|
|
ssl_certificate_key /etc/letsencrypt/live/musictopus.fr/privkey.pem;
|
|
|
|
add_header Strict-Transport-Security "max-age=31536000" always;
|
|
|
|
include /etc/letsencrypt/options-ssl-nginx.conf;
|
|
ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;
|
|
|
|
ssl_trusted_certificate /etc/letsencrypt/live/musictopus.fr/chain.pem;
|
|
ssl_stapling on;
|
|
ssl_stapling_verify on;
|
|
}
|
|
```
|
|
|
|
Une fois le vhost activé (lien symbolique dans le dossier site-enable) et nginx rechargé votre site sera alors accessible en https.
|
|
|
|
### Jobs
|
|
|
|
Par défaut toute les images des albums sont affichées depuis Discogs. Cependant avec les temps les urls deviennent invalides. Pour éviter cela lors de l'ajout d'un album à votre collection un job est créé. Ce job a pour rôle de stocker les images sur un bucket s3.
|
|
|
|
Pour lancer les jobs il faut mettre en place une tâche cron qui sera éxécutée toute les heures (par exemple).
|
|
|
|
Exemple de crontab :
|
|
```crontab
|
|
0 * * * * curl 'http://localhost:3001/jobs' \
|
|
-H 'JOBS_HEADER_KEY: JOBS_HEADER_VALUE' \
|
|
-H 'Accept: application/json'
|
|
30 * * * * curl 'http://localhost:3001/jobs?state=ERROR' \
|
|
-H 'JOBS_HEADER_KEY: JOBS_HEADER_VALUE' \
|
|
-H 'Accept: application/json'
|
|
```
|
|
|
|
N'oubliez pas de remplacer `localhost:30001`, `JOBS_HEADER_KEY` et `JOBS_HEADER_VALUE` par les bonnes valeurs.
|
|
|
|
La première ligne permet de parcourir tous les nouveaux jobs alors que la seconde permet de relancer les jobs en erreurs (après 5 tentatives le job est marqué comme définitivement perdu).
|
|
|
|
### Fichier .env {#env-file}
|
|
|
|
Voici la liste des variables configurables :
|
|
|
|
```
|
|
NODE_ENV # Environnement dans lequel exécuter le projet (development ou production)
|
|
PORT # Port sur lequel éxécuter le serveur (3001 par défaut)
|
|
MONGODB_URI # Url du serveur mongo (mongodb://musictopus-db/musictopus par défaut)
|
|
SECRET # Hash utilisé pour pour sauvegardé les dessions (waemaeMe5ahc6ce1chaeKohKa6Io8Eik par défault)
|
|
DISCOGS_TOKEN # Token Discogs (vous devez créer un compte sur discogs afin d'en obtenir un gratuitement)
|
|
FORMSPREE_ID # Id du formulaire formspree pour la page "nous-contacter"
|
|
MATOMO_URL # Url vers l'instance matomo (exemple: https://analytics.darkou.fr/)
|
|
MATOMO_ID # Id du site sur votre instance matomo (exemple: 1)
|
|
SITE_NAME # Nom du site utilisé dans le titre des pages (MusicTopus par défaut)
|
|
AWS_ACCESS_KEY_ID # Clé d'accès AWS
|
|
AWS_SECRET_ACCESS_KEY # Clé secrète AWS
|
|
S3_ENDPOINT # Url de l'instance aws (s3.fr-par.scw.cloud par défaut)
|
|
S3_SIGNATURE # Version de la signature AWS (s3v4 par défaut)
|
|
S3_BASEFOLDER # Nom du sous dossier dans lequel seront mis les pochettes des albums (dev par défaut)
|
|
S3_BUCKET # Nom du bucket (musictopus par défaut, à changer impérativement si vous voulez que cela fonctionne)
|
|
JOBS_HEADER_KEY # Nom du header utilisé pour l'identification des tâches cron (musictopus par défaut)
|
|
JOBS_HEADER_VALUE # Valeur de la clé (ooYee9xok7eigo2shiePohyoGh1eepew par défaut)
|
|
REGISTRATION_OPEN # true/false en fonction de si vous souhaitez activer ou non l'inscription à votre instance (true par défaut)
|
|
MAIL_METHOD # permet de définir la façon dont les mails de la page contact sont envoyés (formspree ou smtp)
|
|
MAIL_HOST # Adresse du server mail (dams le cas ou MAIL_METHOD est défini sur smtp)
|
|
MAIL_PORT # Port d'écoute du serveur smtp (dams le cas ou MAIL_METHOD est défini sur smtp)
|
|
MAIL_USER # Adresse mail du compte permettant d'envoyer les mails (dams le cas ou MAIL_METHOD est défini sur smtp)
|
|
MAIL_PASSWORD # Mot de passe du compte email (dams le cas ou MAIL_METHOD est défini sur smtp)
|
|
MAIL_TO # Adresse mail du contact qui recevra les messages de la page "nous contacter" (dams le cas ou MAIL_METHOD est défini sur smtp)
|
|
|
|
```
|
|
|
|
## Contributeurs
|
|
|
|
- Damien Broqua (développeur principal du projet)
|
|
- Brunus (Logo et fournisseur d'idées :wink: )
|