At 1:03:20 you say " we didn't set that up yet, I'm gonna go back into the event file and set that up momentarily". However, we don't see you this in the video. I think you might have missed this part out in the recording and it maybe the cause of the issues I am having. Would greatly appreciate if you could look into this when you get the chance.
A, you’re the first person to point this out after 4,000+ views. I didn’t rewatch the whole video, but I think you’re right and I may have edited this out somehow. 🤦🏻♂️ I apologize for the frustration this has probably caused! Check out this link: laravel.com/docs/8.x/broadcasting#broadcast-name On the frontend I am listening for a named broadcast event. You can customize the broadcast name inside of: /app/Events/NewChatMessage.php //add this line of code public function broadcastAs() { return ‘message.new’; }
Amazing! I found this video when I started giving up on getting Laravel Echo to work with Pusher on Laravel 10, Vue 3 and Pusher. Nothing I was doing was working correctly and all of the examples that I had found were older Laravel, older Vue and older Pusher. While this video is using old versions as well, I was able to incorporate this into the newer versions and it finally worked! Thank you for the great explanations! This was one of the first videos that I have watched that I didn't have to multiply the speed also. :)
Excellent tutorial, thank you! This really provides the overall connectivity of all the parts as well as the “behind the scenes reasons why it may be a “best practice”. I’ll use a few different pieces (eg self hosted web sockets, Inertia-recommended “manual visit shortcuts” and associated Inertia “returns/renders” for Laravel controllers), but without the benefit of your tutorial this would have been weeks to implement and possibly without the proper understanding of the whats and whys. I’ll skim through one more time and then watch again in detail while I follow along as I implement this in my environment. Thank you again!
Jim, Iike that idea! I have already pre-recorded a few videos that will be coming out soon... However, I think I’ll do that for the next recording. Thanks for the feedback!
Thank you for this tut! This is the most updated video related to vuejs, laravel pusher + chat. I just encountered two problems while following your tutorial. 1. add broadcastAs in NewChatMessage Event public function broadcastAs() { return 'message.new'; } 2. Don't forget to implement the ShouldBroadcast in NewMessageEvent. Appreciate you man! New subscriber here :)
Well i came back to say that this tutorial is completely wrong. You don’t listen to chatroom when you enter the chat. You listen to any broadcast information to user and depending on what event is that, you do the work with info. You should broadcast to channel User{user_id} a message, then you can use it as notification pop up when user is not in chatroom and use it as a message when user in chatroom and also other any broadcasting info can go through that channel because it is universal. You limit it too much making it only available in chatroom and naming channel chat{chat_id}. Thanks.
Amazing tutorial, man, thank you very much! The only thing I couldn't manage to get right were that the dropdown showing the channel names and the outline border in the input message box. I don't know why, but the dropdown menu doesn't stay in the same line as the chat room title, and the input message box still has a black outline. Thanks!
Great tutorial, thank you. However, if anyone at this time your chat app is running on current Laravel and PHP version, and you are having issue with new message not reflect on other browser without refreshing browser? just restart your local server so that app will recognize changes done at the .env file.
Hello there. I developed my chat using your tutorial, but my vue is in different folder than my laravel. Can you explain how to configure vue in the correct way? Thanks a lot for this video.
Nice vid. Do you know if we are able to use Pusher & Laravel Echo when our frontend is in a different repo of our backend api? Like I was reading some articles yesterday and I was really confused about how this would work
Good question! By default, Laravel 8 comes with Tailwind CSS. So I just struck with the default CSS after creating my new Laravel project. Thanks for watching.
Everything looks good. But why are you not using the message received from echo event and push the new message to the array, rather you are just sending axios request to server and fetching all messages again. That's not efficient.
It works great for me but for some reason when i type a message, the other person could see the message being typed which is odd. Is it perhaps due to my PrivateChannel not properly set up?
Hey. Thanks for the video. Out of curiosity, which one do you think would be easier to maintain (and to use frameworks like Vuetify with): Laravel with Vue integrated to it or separate Laravel and Vue projects to use as backend and frontend respectively.
Prior to Sanctum, I’d say keep it all together. But the purpose of sanctum is to allow SPAs (single page applications) to live in a separate space. So you could completely separate your Vue project on a different server from your Laravel project. As long as you put them on the same root domain you could place Vue and Laravel on separate subdomains without any security/auth problems. I haven’t been able to complete enough projects with Sanctum YET... but I do like the direction they are going.
TBH. I kinda like it. But I feel like I’m cheating. Haha. Homestead was slow. Docker was cool until I got the new Mac M1 chip. Then I had some weird stuff going on. But MAMP just works without issue. I also just like to switch things up for fun sometimes but MAMP is my failsafe.
@@scrypster Thanks for the reply! I'd just started learning Laravel last week and played around with Docker and then Homestead. Then I thought, can't I just use MAMP for this? Then I came across your videos and concluded that if it's good enough for Scrypster then it's good enough for me. :) Thanks for the videos!
I have problem when i try to switch room, the axios fetch give me the structure of the object with the related chat room but they are empty any idea? if i do console.log(response) all the structure of object came out but empty.... thank you!
in web.php i get this error: undefined type 'Inertia\Inertia. What can i do to fix this? can't find anything on stackoverflow as well on this. i get this error on lines like: return Inertia::render('Dashboard');
It should work fine. You’ll just need to make sure the authentication works with your API routes. You may need to provide Axios some authentication info to pass with your request.
I'm having a problem my friends When I create a folder in Pages file it is not recognized It only recognizes previously downloaded files JetStream Inertai
hello, Laravel gives me the error message "Laravel curl error 60: ssl certificate problem ..." when broadcasting the event after creating a message, how can we solve it (i am using Laravel server )
I couldnt even get past "php artisan migrate", it keeps giving me a PDO error no matter what I do even though I created the database in MySQL client and do have mysqli and pdo_mysql extensions in my php.ini. What can be done? I'm sure this would be a great tutorial if I could use it.
Hi, sir, I am facing an error, please guide me on how to resolve this. In the container.vue file the method function getRooms not define in created functions. (Uncaught (in promise) TypeError: this.getRooms is not a function)
I did all the video, but when doing the test from two different browsers it doesn't work, in network tab, in the request to websocket, if the new message is reflected, when sending from the other browser, but the method that refreshes the messages in the DOM is not executed. HELP :(
@@scrypster Same for me.Do you think there are a lot of changes because of the newer version of php and pusher I used ? Php 7.4 and pusher 4.1.5 github.com/adicrainic/chatappLaravel.git
Excellent tutorial, I have succed to implement real time chat on localhost but when I deploy app on server it can't be work 😢 domain can not subdcribe to the channel so I cann't listen to it :( habe any other config for server side ? And thank you
There are so many ways to accomplish real-time functionality, it's just what I'm more comfortable using. I could have used Socket.io as well, but I just have more experience using Pusher. I have some experience with Firebase, but I have only used it for push notifications with PWA's and mobile apps (pusher can do this as well). Firebase is definitely an awesome tool though!
Ive watched quite a bit of the tutorial already but i am a bit confused, is this using ajax or sockets? can I use this to display lets say a list of items for sale and if the prices change in the database the user will see the price change immediately ? and how efficient is this?
Greetings Scypster, I have to say, works perfectly and it is amazing, but i cant understand how pushed helps us with the whole system. Sorry if it is too noob of a question but we need to start from somewhere :)
Hi thank you for the video ! but i have a problem that after setting room changing event with pusher(it works) the message sending is returning a 500 internal error , the save passes but no refresh in messages and the error appear .
Can you post to a GitHub repo? I can check it out and see what the issue is. Give me a day or 2 because I’m currently traveling. But I brought my laptop with me 👍
@@scrypster github.com/ChakerKhachlek/LiveChatApp here ! if i just take off the broadcasting event caller from the controller the post route doesn't call the error anymore but of corse i need that ! and thank you
I thought I could get to the end without making any mistakes but i've miscalculated xD. My chat doesn't show new messages from other users until i change the channel or send a message. I think this line doesn't work in my case window.Echo.private('chat.' + this.currentRoom.id ).listen('.message.new', e => { vm.getMessages(); }); and it's not listening to 'message.new'. Ofcourse i added public function broadcastAs() { return ‘message.new’; } to NewChatMessage.php, any tips how to fix that?
make sure you have correctly bound your model and even in chatRoomSelection Vue as well as option value and key. Can you share your contaner and chatRoomSelection vue code?
Im getting an error when I add the broadcast(new NewChatMessage($newMessage))->toOthers();. And when I comment that out, there is no error. But the page does not update on an new message
After some digging I found an other error inside the /storage/logs/laravel.log I saw something with port. so I changed the pusher port to 80 inside the .env file. This did it for me!
Hello, first of al.. amazing video it really helped me get the chat up and running but I am having one problem, the connect() method kind of enters an infinite loop so it is constantly getting all new messages and that takes up a lot of resources after a while, I don't know if that constant message update should happen or if I did something wrong... I hope you can reply Thank you, im subscribed now
It’s really hard to diagnose without seeing the errors in the console and what’s causing the infinite loop. If you post your source code to a GitHub repo I can take a look.
@@scrypster Actually I solved it already, the problem I guess was that I had already some components with vue and I just implemented the channels and events logic, but I changed most of my components to make it look like yours and now it works perfectly, thanks man cheers
I was facing the same error you can try: 1. composer require pusher/pusher-php-server 2. npm install --save laravel-echo pusher-js 3. clear the cache php artisan optimize This eeor ssee mostly faced because of pusher version
I've set up everything like shown in the video, however, Chrome dev tools network tab is bringing back {"event":"pusher:error","data":{"code":4005,"message":"Path not found"}}. I have copied in the keys from pusher's website to my env file and I have also included the missing function to the NewChatMessage.php. I also have the implements ShouldBroadcast added too.. why am I getting this error?
I was facing the same error you can try: 1. composer require pusher/pusher-php-server 2. npm install --save laravel-echo pusher-js 3. clear the cache php artisan optimize This eeor ssee mostly faced because of pusher version
hello, having the packages you suggest until 5:00 why does my login/register page not have the same look as yours? there is a really big laravel logo in black and white and the field for input as well as the buttons are plain html
I don’t remember what it was. I honestly didn’t like it. Just something I was trying out. It didn’t format correctly and on occasion it would import at the wrong place in my file. Now that you mention it, I gotta figure out one which is was so I can remove it.
Sorry, no repo for this one. In the past I haven’t posted any code because I think it’s important for the learning process to actually write it out. I never learn anything by cloning a repo. But I MIGHT post to GitHub for future videos just to provide something to compare against.
Correct. All messages are visible to all users in this example. In one-to-one chat apps I typically have a chat_room_permissions table where I will store which users can access a specific roomId. Then when I create the broadcast channel I will pull the chat_room_permissions rows matching that specific roomId to confirm users are listed as authorized users. Otherwise they won’t have access to that private channel. In this example I just confirm they are logged into the app. So any authenticated user has access to all rooms. Chat room permission is a bit more advanced and there is some strategy to setting this up if you wanted to allow additional users to be invited etc. Feel free to shoot me an email and I can provide additional details if needed. mj@scrypster.com
how about this logic for one to one user chat ? or do you have a better approach ? $room = ([$this->message->sender_id, $this->message->receiver_id]); sort($room); // if its 21 make it 12 $room = implode($room); return new PrivateChannel('chat.'.$room); // chat.12
at ruclips.net/video/CkRGJC0ytdU/видео.html you give the messageItem the property message. But when i try do it like that, the message is not handed over, resulting in inability to read that message from inside the messageItem. The error is that properties of message cant be read because they are properties of undefined. how do i fix this and link correctly?
At 1:03:20 you say " we didn't set that up yet, I'm gonna go back into the event file and set that up momentarily". However, we don't see you this in the video. I think you might have missed this part out in the recording and it maybe the cause of the issues I am having. Would greatly appreciate if you could look into this when you get the chance.
A, you’re the first person to point this out after 4,000+ views. I didn’t rewatch the whole video, but I think you’re right and I may have edited this out somehow. 🤦🏻♂️ I apologize for the frustration this has probably caused!
Check out this link:
laravel.com/docs/8.x/broadcasting#broadcast-name
On the frontend I am listening for a named broadcast event. You can customize the broadcast name inside of:
/app/Events/NewChatMessage.php
//add this line of code
public function broadcastAs() {
return ‘message.new’;
}
@@scrypster or you can change your code
window.Echo.private("chat."+this.currentRoom.id).
listen('NewChatMessage',e=>{
vm.getMessages();
@@ramiro174 thanks, this works !
I have this error {"event":"pusher:error","data":{"code":4005,"message":"Path not found"}}. Can anyone help me please! Thank you
I downgraded my pusher to 6.0.3 and it works! cheers!
Laravel with Vue is a beast!! Thanks for the awesome tutorial!
Amazing! I found this video when I started giving up on getting Laravel Echo to work with Pusher on Laravel 10, Vue 3 and Pusher. Nothing I was doing was working correctly and all of the examples that I had found were older Laravel, older Vue and older Pusher. While this video is using old versions as well, I was able to incorporate this into the newer versions and it finally worked! Thank you for the great explanations! This was one of the first videos that I have watched that I didn't have to multiply the speed also. :)
Wow! What a great video. Explanations as they should be, not too long, not too short and the perfect video pace.
Thank you!
Excellent tutorial, thank you! This really provides the overall connectivity of all the parts as well as the “behind the scenes reasons why it may be a “best practice”. I’ll use a few different pieces (eg self hosted web sockets, Inertia-recommended “manual visit shortcuts” and associated Inertia “returns/renders” for Laravel controllers), but without the benefit of your tutorial this would have been weeks to implement and possibly without the proper understanding of the whats and whys. I’ll skim through one more time and then watch again in detail while I follow along as I implement this in my environment. Thank you again!
Excellent work! Thank you. Suggestion: show finished work at the beginning to provide viewers a visual understanding of what you are building toward.
Jim, Iike that idea! I have already pre-recorded a few videos that will be coming out soon... However, I think I’ll do that for the next recording. Thanks for the feedback!
Pretty amazing explanation. After Laracast I found your tutorial as best resource. Keep doing your best.
Thank you! I’ll do my best to keep making more content ❤️
Thank you for this tut! This is the most updated video related to vuejs, laravel pusher + chat.
I just encountered two problems while following your tutorial.
1. add broadcastAs in NewChatMessage Event
public function broadcastAs() {
return 'message.new';
}
2. Don't forget to implement the ShouldBroadcast in NewMessageEvent.
Appreciate you man! New subscriber here :)
thnaks mate haha like i just follow the instruction but still didnt get update the real time chat, now i know
you are awesome man ...one of the best contents i have ever seen on laravel...keep them coming
Thank you!
thanks for the tutorial it was a huge help,
the best chat tutorial with laravel, vue and pusher on youtube
It is great, I watched it from start to end and stayed satisfied. Thank you.
Well i came back to say that this tutorial is completely wrong. You don’t listen to chatroom when you enter the chat. You listen to any broadcast information to user and depending on what event is that, you do the work with info. You should broadcast to channel User{user_id} a message, then you can use it as notification pop up when user is not in chatroom and use it as a message when user in chatroom and also other any broadcasting info can go through that channel because it is universal. You limit it too much making it only available in chatroom and naming channel chat{chat_id}. Thanks.
No Words. You are just amazing
Git repository: github.com/luisalonsobr/laravel-spa-chatrooms corrected from github.com/edtrade/laravel-spa-chatrooms
If you face a problem in live chat: 1:03:20 put the event name inside .listen ("NewChatMessage")
thanks!!!
THANKYOU VERY MUCH. PLEASE CONTINUE DOING MORE VIDEOS LIKE THIS. IT REALLY MEANS A LOT
Thank you!
@@scrypster You're a legend in the making sir
Wow, spaces before and after function arguments
Amazing tutorial, man, thank you very much! The only thing I couldn't manage to get right were that the dropdown showing the channel names and the outline border in the input message box. I don't know why, but the dropdown menu doesn't stay in the same line as the chat room title, and the input message box still has a black outline. Thanks!
Great tutorial, thank you.
However, if anyone at this time your chat app is running on current Laravel and PHP version, and you are having issue with new message not reflect on other browser without refreshing browser? just restart your local server so that app will recognize changes done at the .env file.
A big thanks, an amziang turorial👏
Awesome video and explanation. Thank you!
Thank you!
yes Awesome video and explanation
in minute 12:04, why didn't you use belongsTo instead of hasOne ?
I got this error, which I can't figure how to fix when I am following your tutorial.
Laravel + Vue is awesome ❤️❤️❤️
everyone gangsta till pusher section came
Hello there. I developed my chat using your tutorial, but my vue is in different folder than my laravel. Can you explain how to configure vue in the correct way? Thanks a lot for this video.
Around at @50:18 you might get a black-like dropdown list. Thats because you need to pass in props the value 'room' in chatRoomSelection.
Thanks for this wonderful tutorial 😊😊😊
Nice vid. Do you know if we are able to use Pusher & Laravel Echo when our frontend is in a different repo of our backend api? Like I was reading some articles yesterday and I was really confused about how this would work
why do I have to reload another browser for the message to render but I'm connected to the pusher?
Shouldn't chatmessage use belongsTo and not hasOne ?
Hello thanks for the nice tutorial video and just wondering why are you using Tailwind CSS instead of bootstrap?
Good question! By default, Laravel 8 comes with Tailwind CSS. So I just struck with the default CSS after creating my new Laravel project. Thanks for watching.
Everything looks good.
But why are you not using the message received from echo event and push the new message to the array, rather you are just sending axios request to server and fetching all messages again.
That's not efficient.
u for real saved me. thank u so much
It works great for me but for some reason when i type a message, the other person could see the message being typed which is odd. Is it perhaps due to my PrivateChannel not properly set up?
Hey. Thanks for the video.
Out of curiosity, which one do you think would be easier to maintain (and to use frameworks like Vuetify with): Laravel with Vue integrated to it or separate Laravel and Vue projects to use as backend and frontend respectively.
Prior to Sanctum, I’d say keep it all together. But the purpose of sanctum is to allow SPAs (single page applications) to live in a separate space. So you could completely separate your Vue project on a different server from your Laravel project. As long as you put them on the same root domain you could place Vue and Laravel on separate subdomains without any security/auth problems. I haven’t been able to complete enough projects with Sanctum YET... but I do like the direction they are going.
It would me very nice of you if you could link the repository of this application. :) Thank you for this
It's nice to see someone using MAMP for Laravel development. Have you come across any issues with choosing MAMP over Docker or Homestead?
TBH. I kinda like it. But I feel like I’m cheating. Haha. Homestead was slow. Docker was cool until I got the new Mac M1 chip. Then I had some weird stuff going on. But MAMP just works without issue. I also just like to switch things up for fun sometimes but MAMP is my failsafe.
@@scrypster Thanks for the reply! I'd just started learning Laravel last week and played around with Docker and then Homestead. Then I thought, can't I just use MAMP for this? Then I came across your videos and concluded that if it's good enough for Scrypster then it's good enough for me. :) Thanks for the videos!
What about adding features, like deleting messages, muting users if is someone admin and so on ? I would Appreciate so much !
It's a tutorial, not a completed project. That's for you to add and make it your own!
Just found your Channel, subbed. Great content 👍 Are you going to be doing any more Vue Laravel in the near future?
Thank you! I plan on it. Feel free to send any suggestions for video topics and ideas.
I have problem when i try to switch room, the axios fetch give me the structure of the object with the related chat room but they are empty any idea? if i do console.log(response) all the structure of object came out but empty.... thank you!
in web.php i get this error: undefined type 'Inertia\Inertia. What can i do to fix this? can't find anything on stackoverflow as well on this. i get this error on lines like: return Inertia::render('Dashboard');
Awesome!! Question, if I separate the front completely from the laravel using the route Api, will works too?
It should work fine. You’ll just need to make sure the authentication works with your API routes. You may need to provide Axios some authentication info to pass with your request.
what extension in vscode are you using I cant automatically import Input from Input.vue
Great tutorial, thank you!
What happened to the "Here is one I cooked earlier and how it looks and interacts"?
I'm having a problem my friends
When I create a folder in Pages file it is not recognized
It only recognizes previously downloaded files JetStream Inertai
hello, Laravel gives me the error message "Laravel curl error 60: ssl certificate problem ..." when broadcasting the event after creating a message, how can we solve it (i am using Laravel server
)
hey there, is there any way to send message to laravel beyondcode/websockets from python app like flask, django, fastapi, if yes then how ?
iam facing a problem with here /chat/room we have those routes are not working getting internal error
please link github
I couldnt even get past "php artisan migrate", it keeps giving me a PDO error no matter what I do even though I created the database in MySQL client and do have mysqli and pdo_mysql extensions in my php.ini. What can be done? I'm sure this would be a great tutorial if I could use it.
Enable the extension for it in your php.ini
the url occured an error chat_room_id not found , please help
Hi, sir, I am facing an error, please guide me on how to resolve this. In the container.vue file the method function getRooms not define in created functions. (Uncaught (in promise) TypeError: this.getRooms is not a function)
Great job, thanks
It works however I only receive any new messages from others when I refresh the page which is very annoying. :((
Same with mine, have you solved it?
@@konzz9137 1:03:47 I changed .listen('.message.new') to same the name of Events file ".listen('NewChatMessage')" And it's worked.
@@dickhairy332 Thanks a lot.
I did all the video, but when doing the test from two different browsers it doesn't work, in network tab, in the request to websocket, if the new message is reflected, when sending from the other browser, but the method that refreshes the messages in the DOM is not executed.
HELP :(
I’m not sure I follow. Can you post to a GitHub repo and I’ll take a look?
@@scrypster Same for me.Do you think there are a lot of changes because of the newer version of php and pusher I used ? Php 7.4 and pusher 4.1.5
github.com/adicrainic/chatappLaravel.git
@@Lombarzilor8 tanx man
Same for me.
I must say this - VSCODE IS NOT AN IDE ! But a great tutorial tnx :D
You're the best!
Excellent tutorial, I have succed to implement real time chat on localhost but when I deploy app on server it can't be work 😢 domain can not subdcribe to the channel so I cann't listen to it :( habe any other config for server side ? And thank you
if am using livewire instead of inertia then what to do?
and other thing is the files which are in JS folder from where to get those files?
Do you mind sharing why you selected Pusher over Firebase's Realtime DB?
There are so many ways to accomplish real-time functionality, it's just what I'm more comfortable using. I could have used Socket.io as well, but I just have more experience using Pusher.
I have some experience with Firebase, but I have only used it for push notifications with PWA's and mobile apps (pusher can do this as well). Firebase is definitely an awesome tool though!
the relationship in ChatMessage class with room is belongsTo?
Ive watched quite a bit of the tutorial already but i am a bit confused, is this using ajax or sockets? can I use this to display lets say a list of items for sale and if the prices change in the database the user will see the price change immediately ? and how efficient is this?
Is it easy or hard to replace with Laravel Websockets?
Do I need Laravel Echo for Laravel Websockets?
Awesome !! Thank You
Greetings Scypster, I have to say, works perfectly and it is amazing, but i cant understand how pushed helps us with the whole system. Sorry if it is too noob of a question but we need to start from somewhere :)
I did everything correctly, but there is an error showing 204
Please help me
With laravel 11 cant find whats wrong with messages not updating in other browser. Only manual refresh updates the messages
did you found the error? im with laravel11 too and also cant figure out this error
Hi thank you for the video ! but i have a problem that after setting room changing event with pusher(it works) the message sending is returning a 500 internal error , the save passes but no refresh in messages and the error appear .
Can you post to a GitHub repo? I can check it out and see what the issue is. Give me a day or 2 because I’m currently traveling. But I brought my laptop with me 👍
@@scrypster github.com/ChakerKhachlek/LiveChatApp here ! if i just take off the broadcasting event caller from the controller the post route doesn't call the error anymore but of corse i need that ! and thank you
@@chakerkhachlek6803 i got the same error did you solved that?
No same issue
@@scrypster having same issue
I thought I could get to the end without making any mistakes but i've miscalculated xD. My chat doesn't show new messages from other users until i change the channel or send a message.
I think this line doesn't work in my case
window.Echo.private('chat.' + this.currentRoom.id ).listen('.message.new', e => {
vm.getMessages();
});
and it's not listening to 'message.new'. Ofcourse i added
public function broadcastAs() {
return ‘message.new’;
}
to NewChatMessage.php, any tips how to fix that?
Nvm i found out just after i wrote this that i didn't implement ShouldBroadCast in NewChatMessage.php
THANK YOU VERY MUCH.
I can't make work on 50:24 😭😭
make sure you have correctly bound your model and even in chatRoomSelection Vue as well as option value and key. Can you share your contaner and chatRoomSelection vue code?
I'm not getting values in dropdown menu for rooms
I am getting 500 error when the controller calls the event any idea why?
Im getting an error when I add the broadcast(new NewChatMessage($newMessage))->toOthers();. And when I comment that out, there is no error. But the page does not update on an new message
After some digging I found an other error inside the /storage/logs/laravel.log I saw something with port. so I changed the pusher port to 80 inside the .env file. This did it for me!
Hello,
first of al.. amazing video it really helped me get the chat up and running but I am having one problem, the connect() method kind of enters an infinite loop so it is constantly getting all new messages and that takes up a lot of resources after a while, I don't know if that constant message update should happen or if I did something wrong... I hope you can reply
Thank you, im subscribed now
It’s really hard to diagnose without seeing the errors in the console and what’s causing the infinite loop. If you post your source code to a GitHub repo I can take a look.
@@scrypster Actually I solved it already, the problem I guess was that I had already some components with vue and I just implemented the channels and events logic, but I changed most of my components to make it look like yours and now it works perfectly, thanks man cheers
When I inspect my code I did not get message route in network please help me
Thanks for your tutorial,
but why i get this error
{"event":"pusher:error","data":{"code":4009,"message":"Connection not authorized within timeout"}}
I was facing the same error you can try:
1. composer require pusher/pusher-php-server
2. npm install --save laravel-echo pusher-js
3. clear the cache php artisan optimize
This eeor ssee mostly faced because of pusher version
@@kadambhushan i tried these commands you sent but i got error on pusher , in console log i get Disconnection
Can you show the database plz
Would you like to share the source code from this video? It will be much easy focus on video.
my npm run hot not working can you help me?
I've set up everything like shown in the video, however, Chrome dev tools network tab is bringing back {"event":"pusher:error","data":{"code":4005,"message":"Path not found"}}.
I have copied in the keys from pusher's website to my env file and I have also included the missing function to the NewChatMessage.php. I also have the implements ShouldBroadcast added too..
why am I getting this error?
I have same issue man. Hope anyone can help us.
me 3
I was facing the same error you can try:
1. composer require pusher/pusher-php-server
2. npm install --save laravel-echo pusher-js
3. clear the cache php artisan optimize
This eeor ssee mostly faced because of pusher version
nice work 👍 thx
hello, having the packages you suggest until 5:00 why does my login/register page not have the same look as yours? there is a really big laravel logo in black and white and the field for input as well as the buttons are plain html
i got it now, seems kinda flaky tho.
yet i dont get a page when i get to chat.. might be some vite / mix confusion. Why do packages have to change that often?
solved that as well, its nice to have the ability of debugging with f12
This can work with WhastApp Cloud Api?
Witch vs extension to auto - import componets ?
I don’t remember what it was. I honestly didn’t like it. Just something I was trying out. It didn’t format correctly and on occasion it would import at the wrong place in my file. Now that you mention it, I gotta figure out one which is was so I can remove it.
is this application raspbian-compatible?
Hi bro! Nice job! Is there the repo on Git?
Sorry, no repo for this one. In the past I haven’t posted any code because I think it’s important for the learning process to actually write it out. I never learn anything by cloning a repo. But I MIGHT post to GitHub for future videos just to provide something to compare against.
@@scrypster Yes, you're totally right! Thanks again for the tutorial!
@scrypster can you give me github repository for this, please . I have an error
How to make this a one to one chat to users?
SHIIIIIIIIETT, THANKYOUUUUUUU
thanks this helped
To be certain are sent messages visible to all other users at /chat?
Correct. All messages are visible to all users in this example.
In one-to-one chat apps I typically have a chat_room_permissions table where I will store which users can access a specific roomId. Then when I create the broadcast channel I will pull the chat_room_permissions rows matching that specific roomId to confirm users are listed as authorized users. Otherwise they won’t have access to that private channel. In this example I just confirm they are logged into the app. So any authenticated user has access to all rooms.
Chat room permission is a bit more advanced and there is some strategy to setting this up if you wanted to allow additional users to be invited etc. Feel free to shoot me an email and I can provide additional details if needed. mj@scrypster.com
sir all the rest of things are success but I cant see chat history it show as blank ??
can you share git repository of this code
Do you have a github link please ?
I dn. Cant recieve event "subscription". Only "pusher:connection_established"
Solved. I just deleteed pusher app, and created a new one and thats all. Magic.
Waita minute, does this work with Vue 3.0?
i dont think so
how about this logic for one to one user chat ? or do you have a better approach ?
$room = ([$this->message->sender_id, $this->message->receiver_id]);
sort($room); // if its 21 make it 12
$room = implode($room);
return new PrivateChannel('chat.'.$room); // chat.12
I want to implement this to one to one user chat also do u have a repo on ur work?
dude, the methods are not working, everything inside any method in any of the files doesn't work. I can u show us your webpack.mix.js?
at ruclips.net/video/CkRGJC0ytdU/видео.html you give the messageItem the property message.
But when i try do it like that, the message is not handed over, resulting in inability to read that message from inside the messageItem.
The error is that properties of message cant be read because they are properties of undefined. how do i fix this and link correctly?
fixed, was not in the same div tag