"Il y a des problèmes de compatibilité entre Mercure, Symfony et Vue"

Question

J'ai un problème pour configurer Mercure avec Vue et Symfony. J'utilise le hub Mercure connecté à Symfony cli. Dans le fichier .env, j'ai modifié l'url de Mercure pour qu'elle utilise http car cela provoquerait des erreurs de certificat (fournies par symfony).

.env

MERCURE_URL=http://localhost:8000/.well-known/mercure
MERCURE_PUBLIC_URL=http://localhost:8000/.well-known/mercure
MERCURE_JWT_SECRET="!ChangeMe!"

Lorsque j'ouvre l'application symfony dans le navigateur (par exemple http://localhost:8000) et que j'ajoute le script suivant dans la console pour tester :

const eventSource = new EventSource('http://localhost:8000/.well-known/mercure?topic=' + encodeURIComponent('http:// exemple.com/books/1'));
eventSource.onmessage = event =>
    // Cette fonction est appelée à chaque fois que le serveur publie une mise à jour
    console.log(JSON.parse(event.data));
}</pré>
<p>Cela fonctionne et je peux publier quelques modifications dans d'autres onglets.
Cependant, lorsque je fais la même chose dans mon application vue située à l'adresse http://localhost:8080, la console affiche l'erreur suivante : </p>
<pre class="brush:php;toolbar:false;">Accès à la ressource sur 'http://localhost:8000/.well-known/mercure?topic=http://example.com/books/1 ' de l'origine 'http://localhost:8080' a été bloqué par la stratégie CORS : aucun en-tête 'Access-Control-Allow-Origin' n'est présent sur la ressource demandée.

J'ai également deux autres questions :

1. Pourquoi est-ce que j'obtiens une erreur 401 lorsque je colle le jeton jwt dans l'environnement, mais pas lorsque j'utilise le jeton jwt ci-dessus ? ≪/li>
2. Pourquoi ne puis-je pas utiliser Symfony Serve avec https ? J'ai rencontré l'erreur « TransportException : fopen() : Impossible de localiser le certificat CN ». ≪/li>

Answer 1

Cela est dû à CORS car VueJS s'exécute sur un domaine différent de celui sur lequel Mercure est installé.
J'utilise Mercure avec Docker compose, mais si vous le lancez depuis CLI, essayez d'ajouter --cors-allowed-origins='http://localhost:8000 http://localhost:8080'

Autre question 1 : je pense que vous devriez utiliser la même clé en configuration .env et mercure

• à .env中：MERCURE_JWT_SECRET="Secret123"
• Au démarrage de Mercure : --jwt-key='Secret123'