不清楚什么是SWR订阅



我正在浏览SWR的每个特性,并遇到了一个我不熟悉的特性:SWR订阅。我不明白他们所谓的"用swr订阅实时数据源"是什么意思。我正试图寻找一个解释和一个简单的例子来更好地理解这个特性,以及我将如何在现实世界中应用它。

客户端订阅事件意味着维护一个持久的连接(例如WebSocket协议,useSWRSubscription钩子)到一些后端,不断地监听新的事件,而不是仅仅发送一个请求(例如HTTP协议,useSWR钩子)。


使用SWR订阅实时数据源

指的是通过SWR(特别是通过useSWRSubscription())维护持久连接,而不是仅仅通过useSWR()执行一次HTTP请求。

如果你有实时应用程序,如聊天,你必须不断地听其他用户的消息,这是必需的。仅通过useSWR执行一个HTTP请求来获取其他人发送给您的消息是不够的。

相反,您将使用useSWRSubscription钩子来主动侦听(订阅)您的个人WebSocket服务器,或具有实时事件的Firebase之类的东西。然后,无论何时发送新消息,您都可以用SWR客户端适当地处理它,就像获取任何其他常规数据一样,同时受益于SWR的所有优点。


下面是从SWR文档中截取的一段代码,它订阅了一个firebase实时数据库的事件:

import useSWRSubscription from 'swr/subscription'

function Post({ id }) {
const { data } = useSWRSubscription(['views', id], ([_, postId], { next }) => {
const ref = firebase.database().ref('views/' + postId)
ref.on('value', 
snapshot => next(null, snapshot.data()),
err => next(err)
)
return () => ref.off()
})

return <span>Your post has {data} views!</span>
}

在本例中,data将始终是活动一些帖子的浏览量,因为你通过useSWRSubscription订阅了所有实时的浏览量变化。

如果使用useSWR,则需要刷新页面以查看最新的视图计数,或者设置一个较长的轮询间隔,通过refreshInterval设置定期重新获取视图计数-但它不会在实时中了。

最新更新