node(koa2)跨域與獲取cookie

欲作一個node 的網關服務，經過 cookie 作信息傳遞，選擇框架 koa2，這裏簡單記錄跨域處理以及 cookie 獲取。

 

首先：解決跨域問題，使用 koa2-cros 來處理，跨域問題後端處理就好，與前端無瓜。

const cors = require('koa2-cros')

app.use(cors({
  origin: '*'
}))

 

其次：解決跨域是傳遞 cookie 問題，如今的瀏覽器請求默認都不帶 cookie 的，要帶上cookie 則須要添加配置參數，原生 fetch 方法須要添加 credentials: 'include' 參數，使用以下：

fetch('htp://192.168.210.151:3002/proxy', {
    credentials: 'include',
})
// 若是你用的 axios，請在配置參數中添加 withCredentials: true 參數便可

後端添加  credentails: true 

const cors = require('koa2-cros')

app.use(cors({
  origin: '*',
  credentails: true,
}))

而後新問題就出現了，瀏覽器發請求出現以下問題

意思就是 Access-Control-Allow-Origin: '*' 與 credentials: 'include' 不能共存，這裏須要後端的請求頭將 Access-Control-Allow-Origin: '*' 中的 '*' 改爲發送請求的 origin 就行了，若是粗暴點的話直接改爲以下

const cors = require('koa2-cros')

app.use(cors({
  origin: (ctx) => {
     const origin = ctx.headers.origin  // 實際生產請根據具體狀況來進行規則配置
     return origin
  }
}))

 

而後的話客戶端拿到的 Response Headers 對好比下

 

最終，雖然仍是會出現 Provisional headers are shown 這個警告，可是前端也能夠拿到數據了，後端也能夠拿到 cookie 了。

 其餘瀏覽器並無出現這個 Provisional headers are shown 警告，因此這個應該僅是 chrome 的一個警告。