Mercure-Hub: Iniziare con Mercure-hub
Questa documentazione fa parte della guida Iniziare. Consulta la guida completa qui: Come iniziare con Mercure-hub.
👋 Benvenuti nella documentazione di Stackhero!
Stackhero offre una soluzione Mercure-Hub cloud pronta all'uso che fornisce numerosi vantaggi, tra cui:
- Richieste e dimensioni dei messaggi illimitate.
- Nome di dominio personalizzabile protetto con HTTPS (ad esempio, https://real-time.tua-azienda.com).
- Aggiornamenti facili con un solo clic.
- Prestazioni ottimali e sicurezza robusta grazie a una VM privata e dedicata.
- Disponibile in 🇪🇺 Europa e 🇺🇸 USA.
Risparmia tempo e semplifica la tua vita: bastano solo 5 minuti per provare la soluzione di Mercure-Hub cloud hosting di Stackhero!
Sul lato client (il vostro front end), un semplice codice JavaScript che sfrutta l'API HTML5 SSE è tutto ciò di cui avete bisogno.
Nota: In questo esempio, l'abbonato non è autenticato. Per far funzionare questo esempio, dovete consentire abbonati anonimi sulla dashboard di Stackhero.
const endpoint = '<XXXXXX>.stackhero-network.com';
const url = new URL('https://' + endpoint + '/.well-known/mercure');
// Aggiungere i topic da ascoltare
url.searchParams.append('topic', `https://${endpoint}/users/1234`);
url.searchParams.append('topic', `https://${endpoint}/books/1`);
const eventSource = new EventSource(url);
// Il callback viene invocato ogni volta che viene pubblicato un aggiornamento
eventSource.onmessage = e => console.log(e);
Sul lato server (il vostro back end), quando volete inviare un aggiornamento, inviate semplicemente una richiesta POST all'API di Mercure-hub. Ecco un esempio utilizzando Node.js insieme alle librerie JsonWebToken e Request :
const jwt = require('jsonwebtoken');
const request = require('request');
const endpoint = '<XXXXXX>.stackhero-network.com';
const publisherJwtKey = '<your publisher JWT key>';
// Definire i dati da inviare
const data = {
// Il topic dove i dati saranno inviati
topic: `https://${endpoint}/books/1`,
// I dati da inviare al topic
data: JSON.stringify({
available: false,
date: new Date()
})
};
// Generare il token bearer
const bearer = jwt.sign(
{ mercure: { publish: [ data.topic ] } },
publisherJwtKey,
{
expiresIn: 60, // Il token scade in un minuto
noTimestamp: true // Non includere il timestamp 'emesso a' per evitare errori "Token usato prima di essere emesso"
}
);
// Inviare i dati a Mercure-hub affinché distribuisca l'aggiornamento ai client
request.post(
{
url: `https://${endpoint}/.well-known/mercure`,
auth: { bearer },
form: data
},
(err, res) => err ? console.error(err) : console.log(res)
);
Ecco fatto! Ora avete un abbonato sul front end e un editore sul back end che lavorano insieme senza problemi.