Virtual Disco è una piattaforma web che permette di ascoltare musica in modo condiviso e sincronizzato tra più utenti, con chat in tempo reale e gestione delle sessioni. Gli utenti possono caricare i propri file audio, creare stanze virtuali e interagire tramite chat e reactions. Il progetto è pensato per offrire un'esperienza simile a "Spotify Jam", ma con la libertà di usare file personali. Inoltre, la funzione VoiceOver permette agli utenti di comunicare in tempo reale tramite microfono nelle stanze, sincronizzando l’audio con la musica condivisa.
Per installare le dipendenze,buildare il frontend React e avviare il backend Node.js, si possono usare le task preconfigurate di VS Code:
Task VS Code:
React build: installa le dipendenze e compila il frontend (React)NodeJS backend: avvia il backend (Node.js) dopo aver buildato il frontend
In alternativa, si può usare la versione veloce, che salta la fase di verifica e installazione delle dipendenze:
Task VS Code (fast):
React fast build: build rapido del frontendNodeJS backend fast: avvio rapido del backend
Avvio completo:
Start Full App(build + backend)Fast Start Full App(build rapido + backend)
Comandi manuali: Aprire due terminali, uno per ciascun servizio. Partendo dalla cartella root:
- Frontend (React):
cd frontend npm install npm run build - Backend (Node.js):
cd backend node dev-runner.js
Il modulo dev-runner.js consente l'uso di hot keys ('r' o 'R') per riavviare il server backend senza chiudere il terminale.
La funzionalità di voice-over (parlare sopra la musica) è già implementata nel frontend, ma richiede un'istanza di Janus avviata separatamente e raggiungibile dal browser.
Di default, il frontend si connette a http://localhost:8088/janus (porta predefinita per il server HTTP/REST di Janus). Se si usa la configurazione Docker, che espone Janus via WebSocket, usare ws://localhost:8989 (es. docker/janus/docker-compose.yml). Per ambienti HTTPS/TLS utilizzare wss://<host>:8989.
Di seguito sono riportati i comandi utilizzati per avviare Janus su WSL (Ubuntu). In alternativa si può usare Docker (vedi docker/janus), ma in ogni caso è necessario un server Janus in ascolto su Linux.
Passaggi (WSL / Ubuntu):
- Sulla macchina che esegue il frontend, installare le dipendenze JS del client:
npm install janus-gateway webrtc-adapter- Installare le dipendenze di sistema richieste:
sudo apt install -y libmicrohttpd-dev
sudo apt install -y libnice-dev- Compilare e installare libsrtp (esempio con v2.5.0):
cd ~
wget https://github.com/cisco/libsrtp/archive/v2.5.0.tar.gz
tar xfv v2.5.0.tar.gz
cd libsrtp-2.5.0
./configure --prefix=/usr --enable-openssl
make shared_library && sudo make install- Compilare e installare Janus:
cd ~/janus-gateway
# Pulisce eventuali configurazioni fallite precedenti
make clean
./configure --prefix=/opt/janus
# Compilazione degli oggetti
make
sudo make install
sudo make configs- Avviare Janus in ascolto:
/opt/janus/bin/janusConfigurare un IP locale (WSL): Se è necessario specificare un indirizzo IP locale per il mapping NAT (ad es. quando Janus è eseguito in una VM/WSL con un IP distinto), eseguire i seguenti comandi da WSL:
# Spostarsi nella cartella di configurazione di Janus
cd /opt/janus/etc/janus/
# Aprire il file di configurazione
sudo nano janus.jcfg
# Modificare il parametro nat_1_1_mapping impostandolo sull'indirizzo IP locale
# Esempio:
nat_1_1_mapping = "indirizzo-ip-locale"
# Salvare e chiudere (in nano): Ctrl+O -> Invio -> Ctrl+XAprire le porte UDP dal firewall (range 10000-60000): Per permettere il traffico RTP/RTCP, aprire le porte UDP nel range 10000-60000. Esempio con UFW:
sudo ufw allow 10000:60000/udpModificare l'indirizzo di ascolto del trasporto HTTP di Janus (WSL):
sudo nano /opt/janus/etc/janus/janus.transport.http.jcfg
# Nella sezione "general" modificare il valore di ip:
ip = "0.0.0.0"
# Salvare e chiudere (in nano): Ctrl+O -> Invio -> Ctrl+XEsporre Janus da WSL a Windows (porta 8088): Se Janus è eseguito all'interno di WSL e vuoi renderlo raggiungibile dall'host Windows, esegui i seguenti passaggi.
- Verificare che Janus stia ascoltando sulla porta 8088 (in WSL):
sudo netstat -plnt | grep 8088Se viene mostrata una riga con :8088 significa che Janus è in ascolto.
- Recuperare l'indirizzo IP della macchina WSL (in WSL):
hostname -IAnnota l'IP restituito (es. 172.x.x.x).
- Sul lato Windows (PowerShell eseguito come Amministratore) aggiungere il port-proxy per instradare la porta 8088 verso WSL:
netsh interface portproxy add v4tov4 listenport=8088 listenaddress=0.0.0.0 connectport=8088 connectaddress=IP_UBUNTUSostituisci IP_UBUNTU con l'indirizzo ottenuto al punto 2.
- Aprire la porta di Janus sul firewall di Windows:
New-NetFirewallRule -DisplayName "Janus Web Server" -Direction Inbound -LocalPort 8088 -Protocol TCP -Action AllowNota: per rimuovere una regola di portproxy esistente usa
netsh interface portproxy resete assicurati di eseguire PowerShell come amministratore.
Note importanti:
- Se si usa Docker (es.
docker/janus/docker-compose.yml), Janus viene esposto via WebSocket (porta8989) e non come server HTTP tradizionale; l'importante è avere l'istanza Janus in ascolto e raggiungibile dal frontend. - Assicurarsi che l'indirizzo/porta configurati nel frontend corrispondano a dove Janus è in ascolto. Per ambienti di produzione, configurare TLS e utilizzare
wss://....
Per dettagli tecnici, architettura, API e approfondimenti, consultare la Documentazione.
Progetto sviluppato come elaborato personale.