我們都急於編寫一些代碼來與Websocket交互,但是首先我們需要建立必要的代碼基礎,以開始向用戶提交和顯示評論。設置好零件後,我們可以輕鬆地向其中添加Websocket,以進一步增強體驗。
這一集將創建一個供我們與之交互的小型API,並將創建一些結構來保存我們的評論。
首先,我們需要創建資料庫遷移來存儲我們的注釋。這將需要為我們的注釋創建遷移,模型和控制器。
我們將為注釋添加2個API端點。第一種是顯示特定帖子的所有評論。第二個端點將允許我們通過API保存新評論。
然後通過設置前端來使用此API。我們將創建兩個Vue.js方法來處理此問題。第一個是getComments(),它獲取當前帖子的所有評論,第二個是postComments(),它將為當前帖子發布一個新評論。
下一步:實際上,我們連接了Websocket,以便在實時提交新評論時將其顯示在頁面上!
====書面教學====
「掌握Laravel中的Websockets」大師系列頁面:
第2部分:設置注釋AJAX(書面教程)
====這一系列的更多內容。 ====
「掌握Laravel中的Websocket」系列的完整播放列表:
====下載源代碼====
該系列的Github代碼倉庫:
https://github.com/DevMarketer/Laravel_Echo_Tutorial
下載此劇集的源代碼:
https://github.com/DevMarketer/Laravel_Echo_Tutorial/releases/tag/Part2
====跟我來====
訂閱新版本!
訂閱DevMarketer Insider(電子郵件)
https://confirmsubscription.com/h/d/5EDC91CF554832D1
Twitter-http://twitter.com/_jacurtis
(問我問題!)
====問題? ====
在下面發表評論,我或其他人可以為您提供幫助。
對於快速問題,您可能還想在Twitter上問我,我幾乎立即做出回應。
給我發電子郵件[email protected]
感謝您的支持! 。
Im getting empty object in comments, does any one have a solution for that
Stop using freaking pusher… its freaking everywhere and its a paid service. I'm whatching your other video "Self-Host your Own websocket"
why iam getting internal server error GET http://localhost:8000/api/posts/1/comments 500 (Internal Server Error).. in router/api same and commentController index same with your.. but still error
does anyone know how to edit or delete a specific comment?
In the store method of CommentController where you fetch the comment the from database again using with user, we can instead just use $comment->load('user'); and it will eager load the user. Thanks very much for this great detailed tutorial.
i want to know how to deploy on web serve
When calling event on controller then Unknown auth_key broadcastExeption Error. Plz help
if you got 404 not found error. then use full url in axios.get function. like this.
axios.get('/echo/public/api/posts/'+this.post.id+'/comments')
you are too slow man…
I would like to advise you to make short length tutorials and kindly check after a few lines of code so if a view is watching he/she does not have to go back to the beginning of the tutorial to check where they have made a mistake.
You are just copying code, please try to explain it as well when you write some code from somewhere else
Awesome tutorial, although I encounter an error: basically vue inspector cannot find any Vue component. even in network tab Vue.js is not pulled into the application. Any idea? I also tried to run npm run development again :S….with not results. I would appreciate any help with this! thanks 🙂
Alex, thank you so much for your work and for the video! Really cool, you explain everything very available and understandably.
great Instructor, big info and clear code, and save too much time to learn, really you are super instructor
can you give me a video about how to send ajax request through api layer rest full api with jquery and laravel?
if you have an error with post in /api/posts/${this.post.id}/comment, see the video where he explains about api_token, the video is called "Laravel API Token Authentication and Model Observers (Ep 23) – Build an Advanced Blog & CMS0" https://www.youtube.com/watch?v=Ym5_8f-tMzc
I get only curly braces at comment {{comment.user.name}} ..
when I installed vue extension for chrome, it says "vue.js not detected"
I also added the cdn script tag inside app.blade.php . What can be the problem?
Thanks for the websockets tutorials man, i really appriciate it! Big Thanks you are a good man!
Thank u very much sir
I have some little problem , when I save a comment it is giving 500 error code in network and there written that the problem is with mass assignment though I have the same code as yours. What should I do to solve this problem?
whoooow …. look im writing vue…. mindblowen
I have a small question if you dont mind, what is better, to write the vue script inside the blade like you are doing here or write it in seperate component file? Seems easier to do it in blade since you get easy access to laravel data instead of having to make api calls for everything from the component, but this way youre making the code itself public right? which way is generally used in production?
Тамаша! Өте қызықты әрі түсінікті! Сәттілік!
Excellent video and explanation of using Vue.
16:02
Vue.js devtools for Firefox <3
https://addons.mozilla.org/en-US/firefox/addon/vue-js-devtools/
echo.test is not working, I configured vhosts, databases and other required fields as administrator. someone please help..
Alex thanks for great tutorials, I am a newbie to Laravel and I learnt a lot with you! I just have a problem, I can not load the comments to a posts. It returns an error post 403(Forbidden)
Thanks again!
Gracias por el tutorial, pero hablas demaciado.
you can use $comment->load('user') instead of line 22 (14:50)