Chapters
57 Chapters
|
6:19:46
|
Login to bookmark this video
-
Course Code
Subscribe to download the code!
Subscribe to download the code!
-
This Video
Subscribe to download the video!
Subscribe to download the video!
-
Subtitles
Subscribe to download the subtitles!
Subscribe to download the subtitles!
-
Course Script
Subscribe to download the script!
Subscribe to download the script!
49.
Listening & Publishing
Scroll down to the script below, click on any sentence (including terminal blocks) to jump to that spot in the video!
Subscribe to jump to this part in the video!
Keep on Learning!
If you liked what you've learned so far, dive in! Subscribe to get access to this tutorial plus video, code and script downloads.
What PHP libraries does this tutorial use?
// composer.json
{
"require": {
"php": ">=8.2",
"ext-ctype": "*",
"ext-iconv": "*",
"composer/package-versions-deprecated": "1.11.99.1", // 1.11.99.1
"doctrine/annotations": "^1.0", // 1.13.1
"doctrine/doctrine-bundle": "^2.2", // 2.3.2
"doctrine/orm": "^2.8", // 2.9.1
"phpdocumentor/reflection-docblock": "^5.2", // 5.2.2
"sensio/framework-extra-bundle": "^6.1", // v6.1.4
"symfony/asset": "5.3.*", // v5.3.0-RC1
"symfony/console": "5.3.*", // v5.3.0-RC1
"symfony/dotenv": "5.3.*", // v5.3.0-RC1
"symfony/flex": "^1.3.1", // v1.21.6
"symfony/form": "5.3.*", // v5.3.0-RC1
"symfony/framework-bundle": "5.3.*", // v5.3.0-RC1
"symfony/property-access": "5.3.*", // v5.3.0-RC1
"symfony/property-info": "5.3.*", // v5.3.0-RC1
"symfony/proxy-manager-bridge": "5.3.*", // v5.3.0-RC1
"symfony/runtime": "5.3.*", // v5.3.0-RC1
"symfony/security-bundle": "5.3.*", // v5.3.0-RC1
"symfony/serializer": "5.3.*", // v5.3.0-RC1
"symfony/twig-bundle": "5.3.*", // v5.3.0-RC1
"symfony/ux-chartjs": "^1.1", // v1.3.0
"symfony/ux-turbo": "^1.3", // v1.3.0
"symfony/ux-turbo-mercure": "^1.3", // v1.3.0
"symfony/validator": "5.3.*", // v5.3.0-RC1
"symfony/webpack-encore-bundle": "^1.9", // v1.11.2
"symfony/yaml": "5.3.*", // v5.3.0-RC1
"twig/extra-bundle": "^2.12|^3.0", // v3.3.1
"twig/intl-extra": "^3.2", // v3.3.0
"twig/string-extra": "^3.3", // v3.3.1
"twig/twig": "^2.12|^3.0" // v3.3.2
},
"require-dev": {
"doctrine/doctrine-fixtures-bundle": "^3.4", // 3.4.0
"symfony/debug-bundle": "^5.2", // v5.3.0-RC1
"symfony/maker-bundle": "^1.27", // v1.31.1
"symfony/monolog-bundle": "^3.0", // v3.7.0
"symfony/stopwatch": "^5.2", // v5.3.0-RC1
"symfony/var-dumper": "^5.2", // v5.3.0-RC1
"symfony/web-profiler-bundle": "^5.2", // v5.3.0-RC1
"zenstruck/foundry": "^1.10" // v1.10.0
}
}
What JavaScript libraries does this tutorial use?
// package.json
{
"devDependencies": {
"@babel/preset-react": "^7.0.0", // 7.13.13
"@fortawesome/fontawesome-free": "^5.15.3", // 5.15.3
"@hotwired/turbo": "^7.0.0-beta.5", // 1.2.6
"@popperjs/core": "^2.9.1", // 2.9.2
"@symfony/stimulus-bridge": "^2.0.0", // 2.1.0
"@symfony/ux-chartjs": "file:vendor/symfony/ux-chartjs/Resources/assets", // 1.1.0
"@symfony/ux-turbo": "file:vendor/symfony/ux-turbo/Resources/assets", // 0.1.0
"@symfony/ux-turbo-mercure": "file:vendor/symfony/ux-turbo-mercure/Resources/assets", // 0.1.0
"@symfony/webpack-encore": "^1.0.0", // 1.3.0
"bootstrap": "^5.0.0-beta2", // 5.0.1
"chart.js": "^2.9.4",
"core-js": "^3.0.0", // 3.13.0
"jquery": "^3.6.0", // 3.6.0
"react": "^17.0.1", // 17.0.2
"react-dom": "^17.0.1", // 17.0.2
"regenerator-runtime": "^0.13.2", // 0.13.7
"stimulus": "^2.0.0", // 2.0.0
"stimulus-autocomplete": "https://github.com/weaverryan/stimulus-autocomplete#toggle-event-always-dist", // 2.0.0
"stimulus-use": "^0.24.0-1", // 0.24.0-2
"sweetalert2": "^11.0.8", // 11.0.12
"webpack-bundle-analyzer": "^4.4.0", // 4.4.2
"webpack-notifier": "^1.6.0" // 1.13.0
}
}
12 Comments
Hi Ryan, thanks for the tutorial!
I would like also suggest to use http://127.0.0.1:<random_port>/.well-known/mercure/ui/ to publish and subscribe Mercure events. It is really cool.
OMG, how did I not know about that! Awesome! I'm going to add a note - that is really cool!!!
Cheers!
I am getting the following error after adding the
turbo_stream_listentwig function:which is coming from this line.
Do I have something configured incorrectly? I also noticed that my
/assets/controllers.jsonfile was never changed after installing Mercure like Ryan's was. Does symfony/mercure-bundle need to register a controller there?Thx!
Hey @CDesign!
Sorry for the slow reply! Hmm, let's dig into this. Let me answer things in reverse :).
This is probably ok - there IS A slightly different behavior now (actually, introduced by me darn it!) from when I made the video. We talk briefly about it here - https://symfonycasts.com/screencast/turbo/mercure#installing-the-mercure-libraries - but basically, you SHOULD have something that looks like this in your
controllers.jsonfile:But it now comes from (and is under) the
@symfony/ux-turbokey, whereas previously it was under a different key and didn't come until you installed the now-not-neededsymfony/ux-turbo-mercure. Be sure you have"enabled": truefor the above controller.Now, to your first question! And I don't think the
controllers.jsonitem I just talked about is related:What version of
symfony/mecure-bundledo you have (trycomposer show symfony/mercure-bundle)? The missing "default" transport thingy should come from THAT bundle. Also, after installing that bundle, you should have aconfig/packages/mercure.yamlfile that looks like this:See the
defaulton there? If everything is hooked up properly, this config file is ready, which results in adefault"Turbo stream transport" being made available. Something is short-circuiting before that happens...Cheers!
First of all, thank you very much for the detailed response! Much appreciated!
1) On the controllers.json issue, I added the
mercure-turbo-streamkey (which was not there even though I ran recipes). So my file now looks like this:But now
yarn watchcomplains:2) On the twig render error, mercure-bundle 0.3.4 is installed, and the config in
config/packages/mercure.yamllooks exactly like yours above and the three mercure environment vars are declared in .env as follows:And
php bin/console debug:config MercureBundlegives me:I don't know if it helps, but I see that same template render error in the console as soon as I start the server with
symfony serve. Why would I get a render error simply by starting the server? I haven't sent a request yet. Also, in mercure.yaml, I tried changing 'default' to 'test' but the error reported still says "The Turbo stream transport 'default' doesn't exist." And that's even after dumping cache.And not sure if it's relevant, but I am running PHP 7.4 (as that is what is in the 'require' section of composer.json) and Symfony 5.3.0-RC1 and symfony/ux-trubo 1.3.0. Thx!
Hey @CDesign!
Sorry for my slow reply!
Ah... this helps a lot! The latest version of symfony/ux-turbo is 2.9! And the mercure stuff was moved into ux-turbo in 2.6.1. It sounds like you're coding along with our tutorial code. In that case, you should follow the directions in the original video: you WILL need to install the separate
symfony/ux-turbo-mercure(which is deprecated in newer versions) and have a slightly differentcontrollers.json. If you're using this on a real project, I'd back up and make sure you've got the latest versions of everything. Otherwise, if you're just playing around with stuff, follow the video exactly (and ignore the note). I'm happy to help with any snags if you hit them :).Cheers!
Hi sir, thanks for your tutos but when i use docker for mercure i get this error:
Access to resource at 'http://127.0.0.1:61364/.well-known/mercure?topic=product-reviews' from origin 'https://127.0.0.1:8000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Hey wxcvbn612!
Hmm. I believe the problem is that Mercure is running in http and your site is running on https. This different "scheme", iirc, makes Mercure and your site work like they're on different domains, which means you have CORS problems. See if you can getting Mercure running in https, or use your site locally with http to fix the issue.
Cheers!
Yeah i'm not getting a response from curl
curl: (3) [globbing] unmatched close brace/bracket in column 14
curl: (6) Could not resolve host: Bearer
curl: (6) Could not resolve host: eyJhbGciOiJIUzI1NiJ9.eyJtZXJjdXJlIjp7InB1Ymxpc2giOlsiKiJdLCJzdWJzY3JpYmUiOlsiaHR0cHM6Ly9leGFtcGxlLmNvbS9teS1wcml2YXRlLXRvcGljIiwie3NjaGVtZX06Ly97K2hvc3R9L2RlbW8vYm9va3Mve2lkfS5qc29ubGQiLCIvLndlbGwta25v
d24vbWVyY3VyZS9zdWJzY3JpcHRpb2
curl: (35) schannel: next InitializeSecurityContext failed: Unknown error (0x80092012) - The revocation function was unable to check revocation for the certificate.
For people using windows like me:
The curl statement copied from the mercure website has to be edited to work in the windows command console.
1. replace all single quotes with double quotes
2. escape all double quotes within a string with a backslash "\"
3. add "--ssl-no-revoke" right after "curl"
Also for some reason, I'm unable to split the string on multiple lines in the scratch pad and then paste that into the command console, but just keeping it as a single line works.
Hey Nick F.!
Thanks for posting that - i can convert this into a note to help others :).
Cheers!
"Houston: no signs of life"
Start the conversation!