會話cookie在套用部署後無法儲存的問題
P粉312631645
2023-08-29 09:37:44
<p>我使用React創建了一個前端應用程序,然後將其部署到Netlify上。前端應用程式與我創建並部署到Render上的express後端應用程式互動。前端和後端之間的任何互動都受到使用passportjs進行身份驗證的保護。後端應用程式使用passport的本機策略,透過與mongoDB連線驗證使用者是否存在/使用者名稱和密碼是否正確。一旦確認,我使用passport的序列化和反序列化函數來維護登入工作階段。 </p>
<p>在開發過程中,我在http://localhost上使用此應用程式。在此期間,一切都按預期工作。登入會話保存為cookie,我能夠將其作為將來請求中的一部分發送到後端應用程式以驗證使用者。 </p>
<p>當我將前端應用程式部署到Netlify和後端應用程式部署到Render時,會話cookie不再保存,這意味著用戶無法在後端進行身份驗證,因為每個登入後的請求都沒有儲存的會話cookie傳送到後端。 </p>
<p>稍微詳細一些,用於與passport一起建立登入會話的express-session,我使用connect-mongo將會話儲存在MongoDB上。每次我透過前端登入時,我都可以看到會話被建立並儲存在MongoDB中。問題似乎是回應中的cookie沒有傳遞過來,我不知道為什麼。 </p>
<p>這是我目前在express後端應用程式中的會話選項:</p>
<pre class="brush:php;toolbar:false;">app.use(
session({
secret: process.env.SESSION_SECRET,
resave: false,
saveUninitialized: false,
store: MongoStore.create({ mongoUrl: process.env.MONGODB_URI }),
Cookie: {
secure: true,
sameSite: "none",
httpOnly: true,
expires: 24 * 60*60*1000
}
})
);</pre>
<p>我嘗試過搜尋解決方案,並嘗試了許多選項,包括更改<code>secure</code>,更改<code>httpOnly</code>,將<code>sameSite</code>設定為false和none,加入指向前端URL的<code>domain</code>以及指向後端URL的另一個<code>domain</code>,刪除我安裝的任何安全包,如helmet和速率限制器,但似乎沒有任何效果。</p>
<p>我還將憑證的存取控制頭設為true:</p>
<pre class="brush:php;toolbar:false;">app.use((req, res, next) => {
res.setHeader("Access-Control-Allow-Origin", process.env.DOMAIN_URL);
res.setHeader("Access-Control-Allow-Credentials", true);
res.setHeader("Access-Control-Allow-Headers", "Content-Type");
res.header("Access-Control-Allow-Methods", "GET, PUT, POST, DELETE");
next();
});</pre>
<p>對於所有的請求,我都使用<code>fetch</code>。我遇到了一個類似我的問題,但沒有得到解答:Browser not saving session cookie from cross domain server</p>
<p>非常感謝任何幫助或建議! </p>
問題已解決。問題出在信任代理。由於我正在運行多個網域伺服器,後端位於反向代理之後。透過啟用信任代理,我的後端應用程式將了解到它位於代理之後,並且可以信任X-Forwarded-頭字段。為了啟用它,我在後端應用程式中添加了以下程式碼: