亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

使用 Express API 和 React 前端防止 CSRF

使用 Express API 和 React 前端防止 CSRF

慕田峪7331174 2024-01-18 14:59:43
在過去的幾天里,我一直在閱讀有關 CSRF 的內容,感覺我已經很好地掌握了它是什么以及如何預防它。我正在構建一個小型 Express/React 應用程序,它將有一個用于更新應用程序內容的安全管理區域,并且我希望它能夠免受 CSRF 的影響。據我所知,服務器生成 CSRF 令牌然后將其與請求的視圖(頁面)一起發送到客戶端(然后可以將令牌隱藏在 HTML 表單輸入標記中)是很常見的。但是,我的 Express API 不提供 HTML 服務,它是一個僅返回 JSON 數據的 REST API。UI 是用 React 構建的,運行在與服務器不同的端口上。我的問題是;在哪里安全地存儲服務器上生成的令牌?例如,如果我通過點擊“/api/login”以管理員身份登錄,生成令牌,并在 API 響應中將其發送回客戶端,那么我現在應該如何處理它?最初的計劃是使用 Redux 來存儲 token,但是閱讀這篇文章Is Redux secure? ,這聽起來并不理想。我考慮過使用 React 環境變量,但也了解到這些變量在構建中公開。顯然 localStorage 也是一個壞主意......我真的很難使用我正在實現的工具(即 Express/React)找到這個問題的解決方案任何幫助、鏈接、建議、批評將不勝感激,我想學習構建考慮到安全性的應用程序
查看完整描述

1 回答

?
一只甜甜圈

TA貢獻1836條經驗 獲得超5個贊

據我了解,服務器生成 CSRF 令牌是很常見的

服務器需要生成兩個CSRF令牌

然后將其與已請求的視圖(頁面)一起發送到客戶端(然后可以將令牌隱藏在 HTML 表單輸入標記中)。

一個令牌通常作為 cookie 發送,另一個令牌可以作為 HTTP 標頭發送。盡管可以通過這種方式發送,但不需要將其作為 HTML 表單輸入標記(或正文的任何其他部分)發送到 HTML 正文內。

我的問題是;在哪里安全地存儲服務器上生成的令牌?

您不必在服務器上存儲令牌。你可以,但你不需要。

原計劃是使用Redux來存儲token

Redux 存儲位于客戶端的瀏覽器內存中。理論上,一個 React 組件(從服務器響應中提取第二個 CSRF 令牌)可以臨時將令牌存儲在存儲中,以便另一個 React 組件可以從那里獲取它并在發送到服務器之前將其放入下一個請求中。

顯然 localStorage 也是一個壞主意......

是的

任何幫助、鏈接、建議、批評將不勝感激,我想學習構建考慮到安全性的應用程序

Links
With Express 使用這個中間件是很常見的。

批評
嚴格來說,這在 CSRF 相關 Q/A 的背景下是偏離主題的,但是......

UI 是用 React 構建的,運行在與服務器不同的端口上。

react-scripts這暗示了使用which start的可能性webpack-dev-server。它適合開發,但不適合生產中的部署。然而,這是一個單獨的主題,向 Web 客戶端提供 React 應用程序的構建工件(.html 文件、腳本包)與 CSRF 攻擊及其緩解措施無關。

我想學習構建考慮安全性的應用程序

那么您可能會考慮使用一臺網絡服務器而不是兩臺(前端為 React 應用程序提供服務,后端為 API 響應提供服務)。使用一臺服務器進行生產部署,不僅復雜性和成本更低,而且更安全,因為兩臺服務器具有更大的攻擊面,并且使用一臺服務器,您不需要通過使用 CORS 來削弱安全性。


查看完整回答
反對 回復 2024-01-18
  • 1 回答
  • 0 關注
  • 172 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號