„Es gibt Kompatibilitätsprobleme zwischen Mercure, Symfony und Vue'

Question

Ich habe ein Problem bei der Konfiguration von Mercure mit Vue und Symfony. Ich verwende den Mercure Hub, der in Symfony CLI angeschlossen ist. In der .env-Datei habe ich die URL für Mercure geändert, um http zu verwenden, da dies zu Zertifikatsfehlern führen würde (bereitgestellt von Symfony).

.env

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

Wenn ich die Symfony-Anwendung im Browser öffne (z. B. http://localhost:8000) und zum Testen das folgende Skript in der Konsole hinzufüge:

const eventSource = new EventSource('http://localhost:8000/.well-known/mercure?topic=' + encodeURIComponent('http:// example.com/books/1'));
eventSource.onmessage = event =>
    // Diese Funktion wird jedes Mal aufgerufen, wenn der Server ein Update veröffentlicht
    console.log(JSON.parse(event.data));
}

Es funktioniert und ich kann einige Änderungen in anderen Registerkarten veröffentlichen. Wenn ich jedoch dasselbe in meiner Vue-Anwendung unter http://localhost:8080 mache, zeigt die Konsole den folgenden Fehler an:

Zugriff auf die Ressource unter 'http://localhost:8000/.well-known/mercure?topic=http://example.com/books/1 ' vom Ursprung „http://localhost:8080“ wurde durch die CORS-Richtlinie blockiert: Auf der angeforderten Ressource ist kein „Access-Control-Allow-Origin“-Header vorhanden.

Außerdem habe ich noch zwei Fragen:

1. Warum erhalte ich einen 401-Fehler, wenn ich das JWT-Token in die Umgebung einfüge, aber nicht, wenn ich das oben genannte JWT-Token verwende?
2. Warum kann ich Symfony Serve nicht mit https verwenden? Ich habe den Fehler „TransportException: fopen(): Zertifikat CN konnte nicht gefunden werden“ festgestellt.

Answer 1

这是由于CORS的原因，因为VueJS运行的域与Mercure安装的域不同。
我使用Docker compose使用Mercure，但如果您从CLI启动它，请尝试添加--cors-allowed-origins='http://localhost:8000 http://localhost:8080'

其他问题1：我认为您应该在.env和mercure配置中使用相同的密钥

• 在.env中：MERCURE_JWT_SECRET="Secret123"
• 启动mercure时：--jwt-key='Secret123'