<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom"><channel><title>Realtime on BenzHub</title><link>https://benzhub.github.io/tags/realtime/</link><description>Recent content in Realtime on BenzHub</description><generator>Hugo</generator><language>zh-TW</language><lastBuildDate>Mon, 19 Oct 2026 00:00:00 +0000</lastBuildDate><atom:link href="https://benzhub.github.io/tags/realtime/index.xml" rel="self" type="application/rss+xml"/><item><title>Supabase Realtime Authorization 授權與私有聊天室實戰 | Supabase 完整教學</title><link>https://benzhub.github.io/post/supabase/030-realtime-authorization/</link><pubDate>Mon, 19 Oct 2026 00:00:00 +0000</pubDate><guid>https://benzhub.github.io/post/supabase/030-realtime-authorization/</guid><description>&lt;blockquote&gt;&#10;&lt;p&gt;前面三篇我們把 &lt;strong&gt;Realtime&lt;/strong&gt; 三大能力練齊了：&lt;strong&gt;Postgres Changes&lt;/strong&gt; 管「有沒有寫進資料庫」、&lt;strong&gt;Broadcast&lt;/strong&gt; 管「當下的高頻互動」、&lt;strong&gt;Presence&lt;/strong&gt; 管「誰在線上」。但這三者要放進&lt;strong&gt;正式產品&lt;/strong&gt;，還缺最關鍵的一環——&lt;strong&gt;授權（Authorization）&lt;/strong&gt;。這一篇要解決：如何用 &lt;code&gt;config: { private: true }&lt;/code&gt; 建立&lt;strong&gt;私有 channel&lt;/strong&gt;、用 &lt;strong&gt;&lt;code&gt;realtime.messages&lt;/code&gt;&lt;/strong&gt; 表的 &lt;strong&gt;RLS policy&lt;/strong&gt; 授權 &lt;strong&gt;Broadcast&lt;/strong&gt; 與 &lt;strong&gt;Presence&lt;/strong&gt;、用 &lt;code&gt;supabase.realtime.setAuth()&lt;/code&gt; 帶入 JWT，做到「只有房間成員進得來、收得到、看得到」。最後我們把三大功能整合成一個&lt;strong&gt;安全、可上線的即時聊天室&lt;/strong&gt;，為 SB-3 核心服務畫下句點。&lt;/p&gt;&#10;&lt;/blockquote&gt;</description></item><item><title>Supabase Realtime Presence 線上狀態：誰在線上與 typing | Supabase 完整教學</title><link>https://benzhub.github.io/post/supabase/029-realtime-presence/</link><pubDate>Sun, 18 Oct 2026 00:00:00 +0000</pubDate><guid>https://benzhub.github.io/post/supabase/029-realtime-presence/</guid><description>&lt;blockquote&gt;&#10;&lt;p&gt;上一篇的 &lt;strong&gt;Broadcast&lt;/strong&gt; 幫我們把「稍縱即逝的高頻互動」做到毫秒級即時。這一篇要解決協作場景裡另一個經典需求——&lt;strong&gt;「現在有哪些人在線上？」&lt;/strong&gt; &lt;strong&gt;Presence（線上狀態）&lt;/strong&gt; 是 Supabase Realtime 的第三種能力：每個客戶端用 &lt;code&gt;channel.track(state)&lt;/code&gt; 登記自己的狀態，Supabase 底層用 &lt;strong&gt;CRDT&lt;/strong&gt; 在分散式環境自動同步這份共享名單，你只要監聽 &lt;code&gt;sync&lt;/code&gt;／&lt;code&gt;join&lt;/code&gt;／&lt;code&gt;leave&lt;/code&gt; 事件、用 &lt;code&gt;presenceState()&lt;/code&gt; 讀取，就能做出線上頭像、參與者列表與 &lt;strong&gt;typing&lt;/strong&gt; 打字指示。你也會學到用 &lt;code&gt;config: { presence: { key } }&lt;/code&gt; 讓同一人的多分頁多裝置&lt;strong&gt;去重&lt;/strong&gt;，以及人數上限與 &lt;code&gt;track&lt;/code&gt; 頻率的效能注意事項。&lt;/p&gt;&#10;&lt;/blockquote&gt;</description></item><item><title>Supabase Realtime Broadcast 廣播：低延遲用戶端訊息 | Supabase 完整教學</title><link>https://benzhub.github.io/post/supabase/028-realtime-broadcast/</link><pubDate>Sat, 17 Oct 2026 00:00:00 +0000</pubDate><guid>https://benzhub.github.io/post/supabase/028-realtime-broadcast/</guid><description>&lt;blockquote&gt;&#10;&lt;p&gt;上一篇我們用 &lt;strong&gt;Postgres Changes&lt;/strong&gt; 把資料庫的每一次變更變成前端可訂閱的即時事件。這一篇換上 Realtime 的第二種能力——&lt;strong&gt;Broadcast（廣播）&lt;/strong&gt;：一種&lt;strong&gt;不經過資料庫&lt;/strong&gt;、直接在用戶端之間傳遞的低延遲訊息機制。你會學到用 &lt;code&gt;channel.send({ type: 'broadcast', event, payload })&lt;/code&gt; 發送、用 &lt;code&gt;.on('broadcast', { event }, cb)&lt;/code&gt; 接收，並實作最經典的&lt;strong&gt;游標（cursor）同步&lt;/strong&gt;；也會搞懂 &lt;code&gt;self&lt;/code&gt;／&lt;code&gt;ack&lt;/code&gt; 兩個選項、如何用觸發器從資料庫發 Broadcast，以及最關鍵的——&lt;strong&gt;什麼時候該用 Broadcast、什麼時候該用 Postgres Changes&lt;/strong&gt;。&lt;/p&gt;&#10;&lt;/blockquote&gt;</description></item><item><title>Supabase Realtime 入門與 Postgres Changes 即時訂閱 | Supabase 完整教學</title><link>https://benzhub.github.io/post/supabase/027-realtime-postgres-changes/</link><pubDate>Fri, 16 Oct 2026 00:00:00 +0000</pubDate><guid>https://benzhub.github.io/post/supabase/027-realtime-postgres-changes/</guid><description>&lt;blockquote&gt;&#10;&lt;p&gt;檔案處理告一段落，這一篇我們正式走進 &lt;strong&gt;Supabase Realtime&lt;/strong&gt;——把「靜態的資料」變成「即時的資料流」。你會先看懂 Realtime 三大功能（&lt;strong&gt;Postgres Changes&lt;/strong&gt;、&lt;strong&gt;Broadcast&lt;/strong&gt;、&lt;strong&gt;Presence&lt;/strong&gt;）各自的定位，接著手把手用 &lt;code&gt;channel().on('postgres_changes', ...).subscribe()&lt;/code&gt; 即時訂閱資料表的 &lt;code&gt;INSERT&lt;/code&gt;／&lt;code&gt;UPDATE&lt;/code&gt;／&lt;code&gt;DELETE&lt;/code&gt;：從把表加入 &lt;code&gt;supabase_realtime&lt;/code&gt; publication、用 &lt;code&gt;event&lt;/code&gt;／&lt;code&gt;schema&lt;/code&gt;／&lt;code&gt;table&lt;/code&gt;／&lt;code&gt;filter&lt;/code&gt; 做伺服器端過濾，到搞懂 Realtime 與 &lt;strong&gt;RLS&lt;/strong&gt; 的關係，最後在元件卸載時 &lt;code&gt;removeChannel&lt;/code&gt; 乾淨地取消訂閱。這是 Realtime 段的開場，Broadcast 與 Presence 留給後續。&lt;/p&gt;&#10;&lt;/blockquote&gt;</description></item></channel></rss>