嗨!各位朋友大家好,中秋節快樂,烤肉記得吃飽飽,我是阿圓,一樣有請今天的one piece:
(海賊王中最神奇的生物!海賊王中的action cable!)
學 rails 到至今,action cable 一直都是一個蠻吸引我的東西,現在就讓我們來揭開他的神秘面紗!
首先,先來看看官方文件中 action cable 的介紹:
Action Cable seamlessly integrates WebSockets with the rest of your Rails application. It allows for real-time features to be written in Ruby in the same style and form as the rest of your Rails application, while still being performant and scalable. It's a full-stack offering that provides both a client-side JavaScript framework and a server-side Ruby framework. You have access to your full domain model written with Active Record or your ORM of choice.
簡單來說就是:整合了後端 Rails 和前端 JavaScript 呼叫介面,用以無縫接合 Web Socket ,以達到即時通訊的目的。至於為何即時通訊要特別提出來說呢?
先幫大家複習一下 routes 跟 session 篇裡面提到,每當瀏覽器發送一次request,server就會傳回一次response。
假設今天香吉士跟娜美用網路在聊天:
「親親娜美,點心要吃什麼?」
此時,香吉士這邊發了一個 request 到 server ,server也收到了,將香吉士的訊息寫入了資料庫。
但是,娜美此時卻一直停留在同一頁的網站,並沒有重新打一個要求新資料的 request 到 server ,也就一直都沒有 response 回來,那娜美就一直沒收到香吉士的訊息(幫香吉士QQ),這就是一般的 HTTP 的狀況。
而因為HTTP協定的限制,在早期在還沒有Web Socket時,要實現推播技術大概有幾個方式:
簡單來說就是利用 javascript 中的 setInterval()
方式來實現
setInterval(function(){
$.ajax({ url: "server", success: function(data){
//Do something to update your view
}, dataType: "json"});
}, 30000);
或用 setTimeout()
的方式:
(function poll(){
setTimeout(function(){
$.ajax({ url: "server", success: function(data){
// Do something to update your view
//Setup the next poll recursively
poll();
}, dataType: "json"});
}, 30000);
})();
上面的情況是,每隔30秒便向server 發送一個request,要求新的資料。
優點是方便實作、沒有跨瀏覽器的問題、也不需要其他的特殊伺服器。
而致命的缺點就是,就算沒有新資料也是會打 request 跟 response,造成頻寬的浪費
Comet 的中文是彗星,簡單來說就是延長打 request 或 response,的時間,像彗星的尾巴一樣。一般實作方式有兩種:long polling
、streaming
簡單來說就是延長response的時間,再打 response 的時候,持續性的傳送新資料到client端。實作方法的話就是把迴圈丟到 server 端上做。而實作的方式通常是利用html的<ifram>
tag。
優點是這樣就不會有頻寬浪費的問題,但缺點是你的網站可能會一直處於加載狀態。(不過後來google團隊使用一個稱為「htmlfile」的 ActiveX 解決了在 IE 中的加載顯示問題)
至於Long Polling
呢,是利用 ajax 的方式,將 request 的時間延長,直到 server 有回傳新資料才結束這個request,收回response。
一樣解決了頻寬的問題,也比較沒有瀏覽器相容性的問題(聽說IE不支援啦,不過兩方都是過去式了XD),可以說是很好的實作方法。
明天我們繼續來介紹web socket協定!
感謝各位看到這邊,若有任何建議,請各位不吝指教!我們明天見!
Polling, Comet, Long Polling, WebSocket
Ruby on Rails 實戰聖經
跟著 DHH 練習 ActionCable