如何使用 Firebase Authentication、React SPA 和 Django Rest Framework Ba​​ckend 管理會話？

Question

我認為最重要的細節在標題中。 我很清楚這種組合通常是不推薦的。 因此，如果有人提出解決以下詳細問題的替代方法，我將非常高興：

SPA 和 Backend-API 運行在 Google Cloud Services（靈活的 Google App Engine）提供的不同主機上。

我們有一個應該在多個設備上運行的用戶帳戶。 經理將使用一台設備作為商店的日常操作。 當店主（可能與經理不同）想要更改 Store-Properties 時，他應該能夠在不同的設備上登錄並為管理會話請求 TAN。 使用 Firebase 自定義聲明，我們可以使管理會話對帳戶可用，但這意味着商店經理也可以訪問當前會話中的屬性。 這應該是不可能的。 這就是為什么我們需要基於會話的用戶訪問管理。

到目前為止，我看到的唯一選擇是讓 Django 分配會話，這意味着我們必須弄亂 CORS 並減少 Django 的安全措施。 遺憾的是，我一般和 Google 上可用的資源不夠深入。 你對此有什么想法嗎？

Answer 1

我會使用 OAuth2 身份驗證，它可以通過使用某些庫在 Django 中輕松實現。 令牌將從后端生成，在這種情況下，SPA 可以安全地將這些令牌用作 cookie 或在發送回后端或 Django REST 的每個請求的標頭中。

會有一些設置，比如你提到的 CORS。 已經有一些庫可以為您舉起重擔。 您只需要通過一些設置和黑名單或白名單特定的 ips 或域。 也可以使用通配符。

Django 庫：

Django Rest： https : //www.django-rest-framework.org/

Django OAuth2 認證： https : //django-oauth-toolkit.readthedocs.io/en/latest/rest-framework/getting_started.html

Django CORS 頭文件： https : //github.com/adamchainz/django-cors-headers

溫泉：

以下是一些注意事項，可以在將來為您節省一些有關前端 http 請求的時間。

X-CSRFToken：<csrf 令牌>

X 請求寬度：“XMLHttpRequest”

授權：<Oauth2 Token> //'Bearer ****************************************'

ES6 示例：

  (async () =>{
       let headers = {
         "X-Requested-With": "XMLHttpRequest",
         "X-CSRFToken": csrftoken,
         "Authorization": oAuth2Token
        };

        const data = await fetch(url, {
           method: "GET",
           mode: "cors",
           headers: headers,
           credentials: "same-origin",
        });

        let dataJson = await data.json();

        console.log(dataJson) // prints data returned from DJANGO REST API
  })()

筆記：

您可以采取的另一條路線是使用 Django 作為 SPA 使用的唯一后端，並通過 Django 連接到 Firebase。 這樣 SPA 將只與一個后端 (Django) 一起工作，該后端負責處理任何 Firebase 或任何其他 3 方操作