国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

Cookies with CORS

chenjiang3 / 889人閱讀

摘要:由于兩者不同源,服務(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**.comzach**.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

相關(guān)文章

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

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

    Ryan_Li 評論0 收藏0
  • 異步請求與Fetch

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

    vibiu 評論0 收藏0
  • 前端跨域大總結(jié)

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

    Wuv1Up 評論0 收藏0
  • Fetch()

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

    lakeside 評論0 收藏0
  • Fetch API

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

    princekin 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<