摘要:由于兩者不同源,服務(wù)器無法在本地實現(xiàn)讀寫。這樣雖然兩者的沒有變,但它們卻由跨域變成了同源,同時是的子域。原來在發(fā)送請求時,并沒有帶上這一項。這是因為盡管允許跨域請求,但是還是得服從瀏覽器的同源策略。
今天遇到的一個問題:
在本地開發(fā)環(huán)境中,網(wǎng)站是在本地的Express服務(wù)器上跑的,地址是localhost:8000(127.0.0.1:8000),而網(wǎng)站里的所有AJAX請求的服務(wù)器地址則是10.10.5.240:8080。由于兩者不同源,服務(wù)器無法在本地實現(xiàn)讀/寫cookie。
我們的目標是讓服務(wù)器在本地可以讀寫cookie:
1、 origin包括scheme, host, port,所以首先第一步是把本地網(wǎng)站端口改成8080.
2、 為了讓兩者同源,我們可以修改hosts。
首先在控制臺中輸入sudo vim /etc/hosts,打開后輸入i可以進入編輯模式。在空白處添加兩條新的host。
127.0.0.1 a.zach**.com 10.10.5.240 zach**.com
添加完后,按Esc退出編輯模式后,再輸入:wq保存更改退出。
左邊是ip,右邊是對應(yīng)的域名地址。當我們在瀏覽器中輸入一個域名時,瀏覽器首先得把域名地址轉(zhuǎn)化成對應(yīng)的ip地址。
所以添加了這兩條新的host后,我們可以用a.zach**.com:8080來打開網(wǎng)站,同時所有AJAX請求地址換成zach**.com:8080。這樣雖然兩者的ip沒有變,但它們卻由跨域變成了同源,同時a.zach**.com是zach**.com的子域。
這樣一來,當我們在父域下存入cookie后,訪問子域也是可讀取到這個cookie的。
3、 隨意打開一個ajax地址,在控制臺寫入cookie。要注意的是一定要加上domain=.zach**.com;path=/, 否則子域是讀不到該cookie的。
document.cookie = "userId=45fdaf1541fdfds4a;domain=.zach**5078.com;path=/";
做完上面三步以后,我們已經(jīng)能夠在本地的cookie中讀取到userId,但是所有的ajax請求還是返回401。原來在發(fā)送ajax請求時,Request Cookies并沒有帶上userId這一項。
這是因為盡管CORS允許跨域請求,但是cookies還是得服從瀏覽器的同源策略。
4、給XHR對象設(shè)置withCredentials屬性。因為項目有用jQuery,所以下面可以直接在ajaxset中全局統(tǒng)一設(shè)置。
$.ajaxSetup({ xhrFields: { withCredentials: true } });
5、最后修改服務(wù)器的設(shè)置。
加上這一句Access-Control-Allow-Credentials:true。同時由于設(shè)置了credentials,就不能用*來設(shè)置Origin了 Access-Control-Allow-Origin:*, 而應(yīng)該相應(yīng)的改成Access-Control-Allow-Origin: a.zach5078.com:8080, 記得加上端口號。
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/87719.html
摘要:對于簡單請求,基本就是在請求中自動在頭信息中添加一個字段,例如這表示同意的請求。非簡單請求會在正式通信前增加一次查詢請求,成為預(yù)檢。必要字段表示服務(wù)器支持的所有跨域請求方法,只要瀏覽器使用的請求方法包含在內(nèi)即可通過。 關(guān)于http請求的一些理解: CORS是一個w3c標準,全稱為Cross-origin resoursce sharing(跨域資源共享),它允許瀏覽器向不用源的服務(wù)器發(fā)...
摘要:再談異步請求語言將任務(wù)的執(zhí)行模式分成兩種同步和異步。通過對象及時監(jiān)聽完成事件,執(zhí)行事件回調(diào)函數(shù)不會堵塞程序運行。新的是異步請求的另一種方案,比起其復(fù)雜糅雜的寫法,能更簡潔的獲取到數(shù)據(jù)。提供了對和以及其他與網(wǎng)絡(luò)請求有關(guān)的對象的通用定義。 再談異步請求 Javascript語言將任務(wù)的執(zhí)行模式分成兩種:同步(Synchronous)和異步(Asynchronous)。 在瀏覽器,耗時很長...
摘要:跨域正確的打開方式經(jīng)過對同源策略的了解,我們應(yīng)該要消除對瀏覽器的誤解,同源策略是瀏覽器做的一件好事,是用來防御來自邪門歪道的攻擊,但總不能為了不讓壞人進門而把全部人都拒之門外吧。 跨域這兩個字就像一塊狗皮膏藥一樣黏在每一個前端開發(fā)者身上,無論你在工作上或者面試中無可避免會遇到這個問題。為了應(yīng)付面試,我每次都隨便背幾個方案,也不知道為什么要這樣干,反正面完就可以扔了,我想工作上也不會用到...
閱讀 2847·2021-09-10 10:51
閱讀 2215·2021-09-02 15:21
閱讀 3206·2019-08-30 15:44
閱讀 869·2019-08-29 18:34
閱讀 1652·2019-08-29 13:15
閱讀 3322·2019-08-26 11:37
閱讀 2697·2019-08-26 10:46
閱讀 1107·2019-08-26 10:26