vue解決伺服器Session不一致問題(跨域問題) | vue session
最近在做專案時,發現vue前端的登入介面使用axios連線伺服器實現登入功能時,每次請求後端伺服器所儲存的Session物件id都不相同,也就是說前端請求伺服器所得到的Seesion物件無法儲存下來。 上網查詢後發現是跨域問題,也就是說請求的發出點的URL與所請求的URL不同源。(所謂同源(即指在同一個域)就是兩個頁面具有相同的協定(protocol),主機(host)和埠號(port))。 那麼如何解決跨域問題呢,目前網路上主要有兩種解決方案:1.允許使用cookie,攜帶session資訊,保持session的一致性。(大概率無法解決問題...
最近在做專案時,發現vue前端的登入介面使用axios連線伺服器實現登入功能時,每次請求後端伺服器所儲存的Session物件id都不相同,也就是說前端請求伺服器所得到的Seesion物件無法儲存下來。 上網查詢後發現是跨域問題,也就是說請求的發出點的URL與所請求的URL不同源。(所謂同源(即指在同一個域)就是兩個頁面具有相同的協定(protocol),主機(host)和埠號(port))。 那麼如何解決跨域問題呢,目前網路上主要有兩種解決方案:
1.允許使用cookie,攜帶session資訊,保持session的一致性。(大概率無法解決問題)
在vue專案中的main.js中新增(前提是以參照axios):
axios.defaults.withcredentials = true;在後端程式碼中同樣允許使用cookie(以SpringMVC為例)
@CrossOrigin(origins ="http://localhost:8081",allowCredentials = "true")2.使用 vue proxy 代理——將不同源的URL通過代理更改為同源(大概率能解決問題)
以vue-cli3為例,在vue專案根目錄下建立組態檔vue.config.js(與package.json同級),在組態檔中新增以下程式碼:
module.exports = { devServer : { proxy: { "/a" : { target: "http://localhost:8080", changeOrigin: true, pathRewrite: { "/a" : "" } }...