關于Vue/axios下跨域cookie的處理

Mike617 發布于2019-07-25 13:54 / 695人閱讀

摘要：凡事有例外，以下分別對待不同情況服務器端配置即可客戶端配置，這樣大部分瀏覽器都支持跨域了，反正新版本下無問題。但放在默認設置下依然出現無法獲取的問題，至此，查資料查到解決存取的跨域問題，依照文中記載，在追加的響應頭，解決了下的問題。

一般在生產環境下盡量可以通過nginx等反向代理，把vue前端和api接口處理成同一端口和域名。

在開發和測試時，也可以使用兼容性比較好的瀏覽器進行。

凡事有例外，以下分別對待不同情況：

服務器端

配置cors即可

客戶端

配置Axios.defaults.withCredentials = true，這樣大部分瀏覽器都支持跨域cookie了，反正新版本chrome下無問題。

但放在IE11（默認設置）下依然出現無法獲取cookie的問題，至此，查資料查到【P3P解決cookie存取的跨域問題(http://www.cnblogs.com/love2w...】，依照文中記載，在nginx追加P3P的響應頭，解決了IE下的cookie問題。

以下為Nginx配置，以備忘：

    location /xx-erp {

        access_log  /data/nginx/logs/zx3fund.log  main;

        root   /data/nginx/html;
        proxy_pass http://192.168.10.60:811/xx-erp/;
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        add_header P3P "CP=CAO PSA OUR";

        index  index.html index.htm;
    }

IE下截圖：

另外，還有一種方式，在開發階段，用vue中間件proxyTable，把后端接口，代理為與前端執行時的域一致

GPU云服務器云服務器跨域cookie java跨域cookie共享 cookie的使用 ie的cookie管理

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/39504.html

關于vue-resource在dev環境下跨域問題的解決方法

摘要：跨域問題相信跨域問題是每個前端在請求中都會遇到的問題因為瀏覽器的同源策略的限制所以是不支持跨域的當然當后臺在沒有完成搭建的時候這時候我們需要使用到模擬數據的時候這時候很多的就會出現跨域問題在中當然這個問題也不例外如下所以在此我也就整理出了跨域問題相信跨域問題是每個前端在ajax請求中都會遇到的問題,因為瀏覽器的同源策略的限制,所以ajax是不支持跨域的,當然當后臺在沒有完成搭建的...

timger 2019-08-20 17:49 評論0 收藏0
如何開發一個個性化的Web版微信（1）

摘要：版微信登錄地址如有不足與錯誤，請見諒版微信主要參考微信協議進行設計開發項目主要分成三大模塊登錄模塊微信掃碼登錄流程微信容器微信信息會話接收發送心跳監測數據存儲用戶登錄信息狀態信息會話信息先祭圖拜八哥已求無效果圖我們希望實現的功能包括基本的 Web版微信登錄 github地址：https://github.com/hty7/vue-w...如有不足與錯誤，請見諒 Web版微信主要參考W...

dockerclub 2019-08-23 11:32 評論0 收藏0
跨域問題導致設置 cookie 不生效

摘要：我們看下跨域不生效的問題，首先拋出兩個問題我們如何設置又如何確定設置是否生效了首先，我們實現一個簡單的接口新建一個文件，將如下代碼復制進去，通過啟動服務，在本地就可以通過來訪問了我們創建的接口了環境安裝的教程網上有很多詳細的教程，本文不再贅我們看下跨域不生效的問題，首先拋出兩個問題：我們如何設置 cookie ？又如何確定 cookie 設置是否生效了？首先，我們實現一個...

Taste 2019-08-22 15:05 評論0 收藏0
VUE知識點集錦

摘要：載入前后在階段，實例的和都初始化了，但還是掛載之前為虛擬的節點，還未替換。類似于，不同在于提交的是，而不是直接變更狀態可以包含任意異步操作。 vue基礎 1、 router 路由與 a 標簽的區別：https://www.jianshu.com/p/34b...2、 VUE雙向綁定的原理：答：VUE實現雙向數據綁定的原理就是利用了 Object.defineProperty() 這個...

Tecode 2019-08-23 16:02 評論0 收藏0