Next.js:僅在Next.js的服務器端或客戶端運行代碼

如何編寫僅在堆棧的一側執行的代碼:前端或後端

在頁面組件中,您只能在服務器端或客戶端執行代碼,但是請檢查window財產。

此屬性僅存在於瀏覽器內部,因此您可以檢查

if (typeof window === 'undefined') {
}

並在該塊中添加服務器端代碼。

同樣,您只能通過檢查執行客戶端代碼

if (typeof window !== 'undefined') {
}

JS技巧:我們使用typeof運算符在這裡,因為我們無法以其他方式檢測到未定義的值。我們做不到if (window === undefined)因為我們會收到“未定義窗口”運行時錯誤

Next.js作為構建時的優化,也從捆綁軟件中刪除了使用這些檢查的代碼。客戶端捆綁包將不包含包裝在if (typeof window === 'undefined') {}堵塞。

免費下載我的Next.js手冊


接下來的更多教程: