vue와 Symfony를 사용하여 Mercure를 구성하는 데 문제가 있습니다. 저는 Symfony cli에 연결된 머큐어 허브를 사용하고 있습니다. .env 파일에서 http를 사용하도록 Mercure의 URL을 변경했습니다. 이렇게 하면 인증서 오류(symfony에서 제공)가 발생할 수 있습니다.
.env
MERCURE_URL=http://localhost:8000/.well-known/mercure MERCURE_PUBLIC_URL=http://localhost:8000/.well-known/mercure MERCURE_JWT_SECRET="!ChangeMe!"
브라우저(예: http://localhost:8000)에서 심포니 애플리케이션을 열고 테스트를 위해 콘솔에 다음 스크립트를 추가하면:
const eventSource = new EventSource('http://localhost:8000/.well-known/mercure?topic=' + encodeURIComponent('http:// example.com/books/1')); eventSource.onmessage = 이벤트 => // 이 함수는 서버가 업데이트를 게시할 때마다 호출됩니다. console.log(JSON.parse(event.data)); }
작동하며 다른 탭에 일부 변경 사항을 게시할 수 있습니다. 그러나 http://localhost:8080에 있는 vue 애플리케이션에서 동일한 작업을 수행하면 콘솔에 다음 오류가 표시됩니다.
'http://localhost:8000/.well-known/mercure?topic=http://example.com/books/1의 리소스에 액세스 ' 원본 'http://localhost:8080'이 CORS 정책에 의해 차단되었습니다. 요청한 리소스에 'Access-Control-Allow-Origin' 헤더가 없습니다.
그리고 두 가지 질문이 더 있습니다:
<올>
VueJS가 Mercure가 설치된 도메인과 다른 도메인에서 실행되기 때문에 이는 CORS 때문입니다.
를 추가해 보세요.저는 Docker compose와 함께 Mercure를 사용하는데, CLI에서 실행한다면
--cors-allowed-origins='http://localhost:8000 http://localhost:8080'
기타 질문 1: .env와 mercure 구성에서 동일한 키를 사용해야 한다고 생각합니다
.env
中:MERCURE_JWT_SECRET="Secret123"
--jwt-key='Secret123'