Mostra i pulsanti di azione personalizzati sulla tua pagina

Puoi costruire ulteriori interfacce ospitate con qualsiasi componente aggiuntivo, estensione o sito di terze parti, 3. Ogni azione è un singolo URL o HTML personalizzato che verrà caricato e visualizzato quando un utente preme un pulsante sulla pagina di Owncast.

Plugin action buttons require Owncast v0.3.0

Plugins can also contribute action buttons alongside the ones you register by hand. See the plugin manifest documentation.

Esempi

Alcuni esempi di questa funzionalità possono essere cose come:

1. Una classifica per un gioco basato su chat che hai creato o un gioco esterno a cui stai giocando in streaming.
2. Elenco di azioni che eseguono divertenti animazioni sulle sovrapposizioni del tuo stream quando selezionate.
3. Integrazioni con il tuo chatbot per sondaggi che mostra sondaggi recenti e i risultati.
4. Tip Jar per accettare donazioni.
5. Un programma che è più elegante o interattivo di quanto tu possa rappresentare in Markdown.

Limitazioni

1. Gli URL incorporati tramite azioni esterne devono essere ospitati su un server che supporta SSL e ha un protocollo https. Gli URL non protetti non sono supportati.
2. Questi URL devono supportare l'esistenza all'interno di un iframe. Questo significa che X-FRAME-OPTIONS e il CSP non possono essere bloccanti. Se sei bloccato, sei limitato a caricare questo URL in una nuova scheda ed è un'esperienza non ottimale.
3. Anche se puoi sperimentare utilizzando URL che non controlli personalmente, è probabile che molti di essi non funzioneranno a causa delle limitazioni imposte sul server remoto. Un esempio di questo è semplicemente inserire un URL di PayPal o Google.

Come registrare azioni

1. Visita l'amministratore e, sotto "Integrazioni", vai alla pagina "Azioni esterne".
2. Aggiungi un'azione.
3. Imposta l'URL o l'HTML personalizzato di questa azione. Gli URL devono essere una destinazione HTTPS e seguire le migliori pratiche elencate.
4. Dagli un nome che verrà visualizzato sul pulsante che avvia questa azione, una descrizione facoltativa che verrà mostrata nel modulo che presenta l'azione, un URL per un'icona facoltativa per il pulsante e facoltativamente un colore che verrà utilizzato per il pulsante.
5. Se desideri davvero registrare un URL che non controlli, ma non funziona con la funzionalità predefinita, puoi dire di "Aprire esternamente" e si aprirà una nuova scheda nel tuo browser. Questo non è ottimale, ma è un'opzione.

Query parameters passed to URL actions

When a viewer opens a URL action, Owncast appends query parameters to your URL:

• instance is always appended and holds the URL of the Owncast page the viewer is on. Useful if you host one action for multiple servers.
• username and userId are appended only when the viewer has a chat user. username is the display name, which is not unique. userId is a stable identifier for that chat user.

These parameters are conveniences, not authenticated identity. Anyone can open your URL with any values, so never grant access or make privileged API calls based on them. Use them to pre-fill forms and label sessions.

The iframe sandbox

A URL action loads inside a modal in an iframe with sandbox="allow-same-origin allow-scripts allow-popups allow-forms". Your page can run scripts, submit forms, and open popups, but it cannot navigate the top-level Owncast page or trigger downloads.

There is no postMessage bridge. An embedded action cannot close or resize the modal, and it has no way to call back into Owncast. Treat the action as a self-contained page.

Migliori pratiche

1. L'interfaccia utente di questa azione dovrebbe eseguire poca o nessuna navigazione. Non dovrebbe essere trattata come un modo per mostrare semplicemente qualsiasi pagina.
2. Progetta la tua interfaccia utente per vivere in una finestra piccola che non richiede molto, se non altro, scorrimento e sia reattiva ai dispositivi mobili e ai display piccoli.
3. Assicurati che il server dell'URL consenta il caricamento dei tuoi contenuti dal tuo server Owncast tramite X-FRAME-OPTIONS e il CSP.
4. The query parameters Owncast appends tell you which server and which chat user opened the action. Use them to pre-fill forms, and remember they can be faked, so never treat them as proof of identity.
5. Per le azioni HTML che includono uno stile personalizzato tramite tag \<style>, dovresti assicurarti di avere selettori il più specifici possibile, senza conflitti con altri elementi nella pagina.
6. Per le azioni HTML che incorporano direttamente un elemento \<form>, ha senso impostare target="_blank" per aprire la pagina di invio in una nuova scheda. In questo modo i tuoi spettatori non dovranno fermare lo streaming quando inviano il modulo.