跨域問題 續

2022-01-19 16:26:31 字數 2312 閱讀 7134

此貼接上貼實踐解決跨域問題的三種方式剖析

今天繼續做我的schub專案的時候,遇到了苦惱我一天的問題,expresss-session沒有持久化,我在後端把登入的狀態存在req的session裡,下次發post的時候再發請求的時候req.session裡面存的使用者的狀態的字段沒了。

我上次用到express-session的時候還是做得那個微博系統,前後端雜糅的專案(node+ejs),那時候就沒遇到這個問題,後來排查這個問題的時候,google 網上有關express-session的專案,發現這些專案全是前後端在一起的架構,然後我就意識到乙個問題,前後端在一起網域名稱和埠都是一致的,當前後端分離在本地除錯的時候,我處理了很多跨域問題,那麼現在,是不是由跨域問題引起的。

我本地列印除錯了fetch傳送的請求,(因為跨域每次請求發了乙個option),發現每次的session都是新的,sessionid不同,那麼怎麼保持session會話一致呢。

後來差文件,發現:

對於跨域 xmlhttprequest 或 fetch 請求,瀏覽器不會傳送身份憑證資訊。如果要傳送憑證資訊,需要設定 xmlhttprequest 的某個特殊標誌位。對於附帶身份憑證的請求,伺服器不得設定 access-control-allow-origin 的值為「*」。
用了access-control-allow-credentials: true,就不能設定access-control-allow-origin:'*'了。所以可以設定,當a使用者進來的時候,我們設定a使用者為白名單就好,同理b使用者也是。也就是說,誰訪問就把誰的域設定為白名單就可以了。

access-control-allow-origin: | *
所以我的處理一般是:

res.setheader('access-control-allow-origin', req.headers && req.headers.origin ? req.headers.origin : '*');

res.setheader('access-control-allow-methods', 'get, post, options, put, patch, delete');

res.setheader('access-control-allow-headers', 'origin, x-requested-with, content-type, accept, connection, user-agent, cookie, authorization');

res.setheader('access-control-allow-credentials', true);

//post請求之前,會傳送乙個options的跨域請求

if (req.method === 'options') else

})由於前端react裡面請求是fetch傳送的,fetch的原理就是xhr+promise,

那麼fetch肯定也有這麼乙個維持身份憑證的訊息頭,

看mdn:

xmlhttprequest.withcredentials  屬性是乙個boolean型別,它指示了是否該使用類似cookies,authorization headers(頭部授權)或者tls客戶端證書這一類資格證書來建立乙個跨站點訪問控制(cross-site access-control)請求。在同乙個站點下使用withcredentials屬性是無效的。

此外,這個指示也會被用做響應中cookies 被忽視的標示。預設值是false。

如果在傳送來自其他域的xmlhttprequest請求之前,未設定withcredentials 為true,那麼就不能為它自己的域設定cookie值。而通過設定withcredentials 為true獲得的第三方cookies,將會依舊享受同源策略,因此不能被通過document.cookie或者從頭部相應請求的指令碼等訪問。

三點資訊:

1.跨域訪問中,只有帶上withcredentials=true才會允許跨域的請求中帶上自己cookie,(authorization)而cookie中是存有sessionid的,所以也是保持會話一致的前提。

2.同網域名稱下的這個引數是無效的。

3.通過這種方法攜帶的cookie依然受同源策略的限制,我們不能直接通過前端手段或者指令碼訪問到改cookie。

所以我在react前端把所有的fetch的options中加上

credentials: 'include',
即可。此時發現每次fetch請求的session是同乙個了。

cookie跨域問題 跨域登入

cookie跨域時修改不成功,需要在刪除 或者修改時 設定domain值與存入的domain一致,跨域修改cookie不會成功。例如 login.abc.com login工程 www.abc.com abc工程 www.abc.com login.html呼叫login工程的登陸介面 login工...

跨域問題詳解 ajax跨域解決

跨域問題的產出,根本原因在於瀏覽器的同源策略,什麼又是同源策略呢,官方解釋 同源策略限制了從同乙個源載入的文件或指令碼如何與來自另乙個源的資源進行互動。這是乙個用於隔離潛在惡意檔案的重要安全機制。同源的定義 如果兩個頁面的協議,埠 如果有指定 和網域名稱都相同,則兩個頁面具有相同的源。可以跨域讀取其...

Jq 跨域問題

ajax 跨域問題解決方案 jsonp 1 前台ajax 2 後台響應 string info string callbackfunname request callbackparam string k ok response.write var data k r n info info callb...