成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

Cookies with CORS

chenjiang3 / 896人閱讀

摘要：由于兩者不同源，服務(wù)器無法在本地實(shí)現(xiàn)讀寫。這樣雖然兩者的沒有變，但它們卻由跨域變成了同源，同時(shí)是的子域。原來在發(fā)送請求時(shí)，并沒有帶上這一項(xiàng)。這是因?yàn)楸M管允許跨域請求，但是還是得服從瀏覽器的同源策略。

今天遇到的一個(gè)問題：

在本地開發(fā)環(huán)境中，網(wǎng)站是在本地的Express服務(wù)器上跑的，地址是localhost:8000（127.0.0.1：8000）,而網(wǎng)站里的所有AJAX請求的服務(wù)器地址則是10.10.5.240：8080。由于兩者不同源，服務(wù)器無法在本地實(shí)現(xiàn)讀/寫cookie。

我們的目標(biāo)是讓服務(wù)器在本地可以讀寫cookie：

1、 origin包括scheme, host, port，所以首先第一步是把本地網(wǎng)站端口改成8080.

2、 為了讓兩者同源，我們可以修改hosts。

首先在控制臺中輸入sudo vim /etc/hosts，打開后輸入i可以進(jìn)入編輯模式。在空白處添加兩條新的host。

127.0.0.1       a.zach**.com
10.10.5.240     zach**.com

添加完后，按Esc退出編輯模式后，再輸入:wq保存更改退出。

左邊是ip，右邊是對應(yīng)的域名地址。當(dāng)我們在瀏覽器中輸入一個(gè)域名時(shí)，瀏覽器首先得把域名地址轉(zhuǎn)化成對應(yīng)的ip地址。

所以添加了這兩條新的host后，我們可以用a.zach**.com：8080來打開網(wǎng)站，同時(shí)所有AJAX請求地址換成zach**.com:8080。這樣雖然兩者的ip沒有變，但它們卻由跨域變成了同源，同時(shí)a.zach**.com是zach**.com的子域。

這樣一來，當(dāng)我們在父域下存入cookie后，訪問子域也是可讀取到這個(gè)cookie的。

3、 隨意打開一個(gè)ajax地址，在控制臺寫入cookie。要注意的是一定要加上domain=.zach**.com;path=/, 否則子域是讀不到該cookie的。

document.cookie = "userId=45fdaf1541fdfds4a;domain=.zach**5078.com;path=/";

做完上面三步以后，我們已經(jīng)能夠在本地的cookie中讀取到userId,但是所有的ajax請求還是返回401。原來在發(fā)送ajax請求時(shí)，Request Cookies并沒有帶上userId這一項(xiàng)。

這是因?yàn)楸M管CORS允許跨域請求，但是cookies還是得服從瀏覽器的同源策略。

4、給XHR對象設(shè)置withCredentials屬性。因?yàn)轫?xiàng)目有用jQuery,所以下面可以直接在ajaxset中全局統(tǒng)一設(shè)置。

     $.ajaxSetup({
       xhrFields: {
          withCredentials: true
       }
     });

5、最后修改服務(wù)器的設(shè)置。
加上這一句Access-Control-Allow-Credentials:true。同時(shí)由于設(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://systransis.cn/yun/87719.html

相關(guān)文章

  • http請求 header里General Response Request 里面參數(shù)的含義

    摘要：對于簡單請求，基本就是在請求中自動(dòng)在頭信息中添加一個(gè)字段，例如這表示同意的請求。非簡單請求會(huì)在正式通信前增加一次查詢請求，成為預(yù)檢。必要字段表示服務(wù)器支持的所有跨域請求方法，只要瀏覽器使用的請求方法包含在內(nèi)即可通過。 關(guān)于http請求的一些理解： CORS是一個(gè)w3c標(biāo)準(zhǔn)，全稱為Cross-origin resoursce sharing(跨域資源共享)，它允許瀏覽器向不用源的服務(wù)器發(fā)...

    Ryan_Li 評論0 收藏0

  • 異步請求與Fetch

    摘要：再談異步請求語言將任務(wù)的執(zhí)行模式分成兩種同步和異步。通過對象及時(shí)監(jiān)聽完成事件，執(zhí)行事件回調(diào)函數(shù)不會(huì)堵塞程序運(yùn)行。新的是異步請求的另一種方案，比起其復(fù)雜糅雜的寫法，能更簡潔的獲取到數(shù)據(jù)。提供了對和以及其他與網(wǎng)絡(luò)請求有關(guān)的對象的通用定義。 再談異步請求 Javascript語言將任務(wù)的執(zhí)行模式分成兩種：同步（Synchronous）和異步（Asynchronous）。 在瀏覽器，耗時(shí)很長...

    vibiu 評論0 收藏0

  • 前端跨域大總結(jié)

    摘要：跨域正確的打開方式經(jīng)過對同源策略的了解，我們應(yīng)該要消除對瀏覽器的誤解，同源策略是瀏覽器做的一件好事，是用來防御來自邪門歪道的攻擊，但總不能為了不讓壞人進(jìn)門而把全部人都拒之門外吧。 跨域這兩個(gè)字就像一塊狗皮膏藥一樣黏在每一個(gè)前端開發(fā)者身上，無論你在工作上或者面試中無可避免會(huì)遇到這個(gè)問題。為了應(yīng)付面試，我每次都隨便背幾個(gè)方案，也不知道為什么要這樣干，反正面完就可以扔了，我想工作上也不會(huì)用到...

    Wuv1Up 評論0 收藏0

  • Fetch()

    摘要：常見的坑接收到表示錯(cuò)誤的狀態(tài)碼時(shí)，返回的不會(huì)被標(biāo)記為即使?fàn)顟B(tài)碼為或。會(huì)將狀態(tài)標(biāo)記為但返回值但屬性設(shè)置為。網(wǎng)絡(luò)故障或請求被阻止才會(huì)標(biāo)記為。原始請求請求使用箭頭函數(shù)獲取一個(gè)文件，并打印到控制臺。參數(shù)接受第二個(gè)可選參數(shù)，控制不同配置的參數(shù)。 Fetch()提供了一種方式進(jìn)行跨網(wǎng)絡(luò)異步請求資源的方式，用于訪問和操作HTTP管道的部分，比如：請求和相應(yīng)。 fetch常見的坑： 接收到表示錯(cuò)誤...

    lakeside 評論0 收藏0

  • Fetch API

    摘要：現(xiàn)在有很多優(yōu)雅的包裝，但是這遠(yuǎn)遠(yuǎn)不夠。一個(gè)實(shí)例代表了一個(gè)的請求部分。一旦創(chuàng)建，它所有的屬性都是只讀的。處理基本的返回不是所有的接口都返回格式的數(shù)據(jù)，所以還要處理一些類型的返回結(jié)果。最后很好用，但是現(xiàn)在還不允許取消一個(gè)請求。 Fetch API 一個(gè)隱藏最深的秘密就是AJAX的實(shí)現(xiàn)底層的XMLHttpRequest，這個(gè)方法本來并不是造出來干這事的?，F(xiàn)在有很多優(yōu)雅的API包裝XHR，但是...

    princekin 評論0 收藏0

發(fā)表評論

0條評論

最新活動(dòng)
閱讀需要支付1元查看
<