Inici Ràpid del SDK
Posa en marxa el reproductor PWA en 5 minuts.
Prerequisits
- Node.js 22+ i pnpm
- Accés a una instància de Xibo
- Clau secreta del CMS (des de Configuració del CMS → Configuració de Pantalla)
Requisit de Mateix Origen
El reproductor PWA s'ha de servir des del mateix domini que el Xibo. Totes les crides a l'API van a l'origen del CMS, i els navegadors bloquegen les peticions d'origen creuat.
Per a ús local/quiosc, utilitza l'Electron wrapper que gestiona CORS a nivell de sessió de Chromium.
Compilació
# Clone the PWA repo
git clone https://github.com/xibo-players/xiboplayer-pwa.git
cd xiboplayer-pwa
# Install dependencies
pnpm install
# Build for production
pnpm run build # Output → dist/
Desplegament al CMS
Copia dist/* al directori web/chromeos/ del CMS:
podman cp dist/. xibo-cms-web:/var/www/cms/web/chromeos/
El .htaccess del CMS reescriu /player/pwa/* → web/chromeos/*.
Accedir al Reproductor
Obre: https://your-cms.example.com/player/pwa/
Configura amb:
- Adreça del CMS:
https://your-cms.example.com(mateix domini) - Clau del CMS: La teva clau secreta del CMS
- Nom de la Pantalla: El nom de la teva pantalla
Autoritzar al CMS
- Obre la interfície d'administració del CMS
- Ves a Pantalles
- Troba la teva pantalla (estat: En espera)
- Autoritza-la
- Actualitza la pàgina del reproductor
El reproductor començarà a descarregar fitxers i mostrar dissenys.
Alternativa: Electron (per a quiosc/escriptori)
Per a desplegaments on l'allotjament de mateix origen no és disponible:
sudo dnf install xiboplayer-electron
xiboplayer-electron --cms-url=https://your-cms.example.com --cms-key=KEY
Consulta Reproductor Electron per a més detalls.
Resolució de Problemes
"Connection failed: NetworkError"
- Verifica que l'adreça del CMS coincideix amb el domini des d'on es serveix el reproductor
- Comprova la consola del navegador per errors de CORS (significa que el reproductor no és del mateix origen)
- Utilitza Electron per a configuracions d'origen creuat
"Display not authorized"
- Ves a CMS → Pantalles → Autoritza la teva pantalla
- Actualitza la pàgina del reproductor
Els dissenys no es mostren
- Comprova la consola del navegador per errors de descàrrega
- Verifica que la programació té dissenys actius assignats a la pantalla
Propers Passos
- Guia de desplegament — detalls complets del desplegament
- Arquitectura — disseny del sistema i patrons
- Paquets — els 13 paquets del SDK
