I have a quick test Symfony application running to try to integrate the Mercure protocol.
I have a test Mercure hub running with the following:
JWT_KEY='aVerySecretKey' ADDR='localhost:3000' ALLOW_ANONYMOUS=1 CORS_ALLOWED_ORIGINS=* ./mercure
I have a form that submits the data to the following endpoint:
/**
* @Route("/resources", name="resourcesPost", methods={"POST"})
*/
public function resourcesPost(Publisher $publisher, Request $request){
$user = $this->getUser();
$update = new Update(
'http://example.com/books/1',
json_encode([
'from' => $user->getFullName(),
'sent at' => (new DateTime())->format('H:i:s'),
'message' => $request->request->get('message'),
])
);
$publisher($update);
return $this->redirectToRoute('resources');
}
Once I hit the form I get the following in the debugger:
127.0.0.1 - - [19/Jun/2019:13:27:40 -0400] "GET /hub?topic=http%3A%2F%2Fexample.com%2Fbooks%2F1&topic=http%3A%2F%2Fexample.com%2Fbooks%2F2&topic=http%3A%2F%2Fexample.com%2Freviews%2F%7Bid%7D HTTP/1.1" 200 31 "http://localhost:8888/resources" "Mozilla/5.0 (Windows N
T 10.0; Win64; x64; rv:67.0) Gecko/20100101 Firefox/67.0"
time="2019-06-19T13:32:50-04:00" level=info msg="Subscriber disconnected" remote_addr="127.0.0.1:65391"
time="2019-06-19T13:32:53-04:00" level=info msg="Update published" event_id=cd3acff1-7e9b-4e28-b6ba-e79aeb4c1791 remote_addr="127.0.0.1:49546"
127.0.0.1 - - [19/Jun/2019:13:32:53 -0400] "POST /hub HTTP/1.0" 200 36 "" ""
time="2019-06-19T13:32:53-04:00" level=info msg="Event sent" event_id=cd3acff1-7e9b-4e28-b6ba-e79aeb4c1791 remote_addr="127.0.0.1:65384"
However, the javascript on the second browser that is listening, does not put the response in the console log :
const u = new URL('http://localhost:3000/hub');
u.searchParams.append('topic', 'http://example.com/books/1');
// Subscribe to updates of several Book resources
u.searchParams.append('topic', 'http://example.com/books/2');
// All Review resources will match this pattern
u.searchParams.append('topic', 'http://example.com/reviews/{id}');
const es = new EventSource(u);
let lastEventId = null;
es.onmessage = e => {
let data = JSON.parse(e.data);
lastEventId = e.lastEventId;
console.log(data);
}
If I go into the back into the terminal and run ctrl+c (to kill the Mercure server) the data will then get pushed into the javascript. My question is how do I get it to automatically push the data to the javascript without having to kill the Mercure server (running on localhost:3000) and then restart it?
