Releases: DevMarketer/Laravel_Echo_Tutorial
Part 4: Authenticating Private Channels
Up to this point we have always worked with public channels in Laravel Echo. Public channels can be useful for websites with public facing frontends and with notifications like comments that don't provide sensitive or private information.
So what do you do when your channels are distributing information that is only intended for certain users (like admins or managers) or the author of a blog post, or the information being sent is more sensitive? Well that is when we use private channels, which require users to authenticate in order to subscribe to a channel.
There are three basic steps needed to convert a channel from a public channel to a private one:
- In your
App\Events
file we need to changereturn new Channel('post')
toreturn new PrivateChannel('post')
inside thebroadcastOn()
method. - On the client side (which for us is on the
posts.show
blade file) we need to tell laravel echo that we are subscribing to a private channel now. This means changingEcho.channel()
toEcho.private()
. Everything else can stay the same. - Lastly, in our
routes/channels.php
file we can define our private channel with authentication rules by ensuring that the function returns true or false to determine the user's eligibility for that private channel.
Part 3: Connecting to Our Socket Server
It is finally time to connect to our socket server and start serving broadcasting events to our users. In this tutorial part, we will be creating our event, which we will trigger server-side when we hit the new comment API point that we created in the last video.
As soon as we submit a new comment to that API endpoint, we will trigger the event after it saves, and pass the new comment's details to the socket server.
On the server side we can just use the basic Laravel event/listener system, except that we won't bother ourselves with listeners. Listeners can still be used to run scripts server-side when an event is triggered, but our primary concern is to trigger events and then broadcast those events, which will be sent to our socket server on Pusher.com.
On the client-side we will use Laravel Echo to subscribe to channels when the page loads. This will prepare our clients to accept any new events that come down the tube while we are subscribed. Then we will tell Laravel Echo what to do when we hear the NewComment event, and use Vue.js to update the newest comment into our comments array, so that it is automatically displayed in the comments feed.
In the end we will have a powerful live commenting realtime engine. It will be a great example of what can be done with websockets and Laravel echo!
Read Written Tutorial: Coming Soon
Watch Tutorial Free on YouTube: https://youtu.be/UUpZlSbGs9M
Part 2: Setting Up Comments AJAX
This Episode is focused on setting up comments and the comments API. This will be useful for us to interact with and will create some structure to save our comments.
First we need to create a database migration to store our comments. This will require creating a migration, a model, and a controller for our comments.
We will make 2 API endpoints for our comments. The first is to display all comments for a specific post. The second endpoint will allow us to save a new comment via the API.
Then its time to use this API by setting up our frontend. We will create two Vue.js methods to handle this. The first is getComments() which gets all the comments for the current post, and the second is postComments() which will post a new comment for the current post.
Read Written Tutorial: https://devmarketer.io/learn/part-2-creating-comments-ajax/
Watch Tutorial Free on YouTube: https://youtu.be/xIEybma2RqM
Start Here
This is where the tutorial starts. It is suggested that you start at this tag which will give you a basic blog system to begin working with for this tutorial.
Once you download this folder you will need to prepare a few things before you are ready to start. Follow these steps to get the project to a workable state.
- Clone this repository (or download and extract the .zip)
- Run
composer install
from inside the project directory to download PHP dependencies - Run
npm install
oryarn
to download JS dependencies - Run
cp .env.example .env
to create your projects'.env
file - Run
php artisan key:generate
to create a new encryption key - Open the project and edit the
.env
file to add database settings to your project. Take note of the database name, password, and username to make sure they match your system's settings. Change any other environment settings you desire, but no other setting changes are required to follow this tutorial. - Back in the terminal, run
php artisan migrate
to migrate your database - Run
php artisan db:seed
to seed your database
Congratulations! You should now be ready to begin working on the tutorial.
Written Tutorial: https://devmarketer.io/learn/part-1-setting-up-our-laravel-echo-project
Watch Tutorial: https://youtu.be/tExUWmF6wNM