摘要:跨域的請求出于安全性的原因,瀏覽器會限制中的跨域請求。跨源共享標準需要瀏覽器和服務端共同配合才能完成,目前瀏覽器廠商已經可以將請求部分自動完成,所以跨源資源訪問的重點還是在于服務器端。指明預請求或者跨域請求的來源。
跨域的請求
出于安全性的原因,瀏覽器會限制 Script 中的跨域請求。由于 XMLHttpRequest 遵循同源策略,所有使用 XMLHttpRequest 構造 HTTP 請求的應用只能訪問自己的域名,如果需要構造跨域的請求,那么開發者需要配合瀏覽器做出一些允許跨域的配置。
W3C 應用工作組推薦了一種跨資源共享的機制,這種機制讓 Web 應用服務器能支持跨站訪問控制,從而使得安全的進行跨站數據傳輸成為可能,該機制通過幾種方式來對原有模式進行了擴展:
響應的頭部應該追加 Access-Control-Allow-Orign,用來表明哪些請求源被允許訪問資源內容
瀏覽器會對請求源和響應中的值進行匹配驗證
對于跨域的請求,瀏覽器會預發送一個非簡單方式的請求,來判斷給定資源是否準備接受跨域資源訪問
服務端應用通過檢查請求頭部的 Orign 來判定請求是否跨域。
跨源資源共享標準跨源資源共享標準通過新增一系列 HTTP 頭,讓服務器能聲明哪些來源可以通過瀏覽器訪問該服務器上的資源。另外,對哪些會對服務器數據造成破壞性響應的 HTTP 請求方法(特別是 GET 以外的 HTTP 方法,或者搭配某些 MIME 類型的 POST 請求),標準強烈要求瀏覽器必須先以 OPTIONS 請求方式發送一個預請求(preflight request),從而獲取知服務器端對跨源請求所支持 HTTP 方法。在確認服務器允許跨源請求的情況下,以實際的 HTTP 請求方法發送那個真正的請求。服務器端也可以通知客戶端,是不是需要隨同請求一起發送信用信息(包括 Cookies 和 HTTP 認證相關數據)。
跨源共享標準需要瀏覽器和服務端共同配合才能完成,目前瀏覽器廠商已經可以將請求部分自動完成,所以跨源資源訪問的重點還是在于服務器端。
下面列出一些標準中可用的響應頭和請求頭。
Response HeaderAccess-Control-Allow-Origin : 指明哪些請求源被允許訪問資源,值可以為 "*","null",或者單個源地址。
Access-Control-Allow-Credentials : 指明當請求中省略 creadentials 標識時響應是否暴露。對于預請求來說,它表明實際的請求中可以包含用戶憑證。
Access-Control-Expose-Headers : 指明哪些頭信息可以安全的暴露給 CORS API 規范的 API。
Access-Control-Max-Age : 指明預請求可以在預請求緩存中存放多久。
Access-Control-Allow-Methods : 對于預請求來說,哪些請求方式可以用于實際的請求。
Access-Control-Allow-Headers : 對于預請求來說,指明了哪些頭信息可以用于實際的請求中。
Origin : 指明預請求或者跨域請求的來源。
Access-Control-Request-Method : 對于預請求來說,指明哪些預請求中的請求方式可以被用在實際的請求中。
Access-Control-Request-Headers : 指明預請求中的哪些頭信息可以用于實際的請求中。
Request HeaderOrigin : 表明發送請求或預請求的來源。
Access-Control-Request-Method : 在發送預請求時帶該請求頭,表明實際的請求將使用的請求方式。
Access-Control-Request-Headers : 在發送預請求時帶有該請求頭,表明實際的請求將攜帶的請求頭。
中間件在 Laravel 中允許跨域請求,我們可以構建一個追加響應的中間件,用來添加專門處理跨域的請求的響應頭:
header("Access-Control-Allow-Origin", config("app.allow")); $response->header("Access-Control-Allow-Headers", "Origin, Content-Type, Cookie, Accept"); $response->header("Access-Control-Allow-Methods", "GET, POST, PATCH, PUT, OPTIONS"); $response->header("Access-Control-Allow-Credentials", "true"); return $response; } }
其中有以下需要注意的地方:
對于跨域訪問并需要伴隨認證信息的請求,需要在 XMLHttpRequest 實例中指定 withCredentials 為 true。
這個中間件你可以根據自己的需求進行構建,如果需要在請求中伴隨認證信息(包含 cookie,session)那么你就需要指定 Access-Control-Allow-Credentials 為 true, 因為對于預請求來說如果你未指定該響應頭,那么瀏覽器會直接忽略該響應。
在響應中指定 Access-Control-Allow-Credentials 為 true 時,Access-Control-Allow-Origin 不能指定為 *
后置中間件只有在正常響應時才會被追加響應頭,而如果出現異常,這時響應是不會經過中間件的。
PS: 歡迎關注簡書 Laravel 專題,也歡迎 Laravel 相關文章的投稿 :),作者知識技能水平有限,如果你有更好的設計方案歡迎討論交流,如果有錯誤的地方也請批評指正,在此表示感謝謝謝 :)
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/21850.html
摘要:而我的新輪子也并不是專門解決它的問題的,而是順便解決而已。概述這個包,支持在所有的項目中使用。一旦出現成員,代表允許全部。列出允許跨域請求的方法列表,默認是代表所有方法。信息地址嗯,新輪子,求一波。 showImg(https://segmentfault.com/img/bV5VxN?w=844&h=656); 是的,可能了解 Laravel 的都知道,在 Laravel 中簡單的設...
摘要:開啟跨域對于跨域訪問并需要伴隨認證信息的請求,需要在實例中指定為在響應中指定為時,不能指定為自定義命令命令生成文件這里是命令行調用的名字如這里的命令行調用的時候就是這里填寫命令行的描述當執行 laravel開啟跨域 //對于跨域訪問并需要伴隨認證信息的請求,需要在 XMLHttpRequest 實例中指定 withCredentials 為 true,在響應中指定 Access-Con...
摘要:上一章了解了的基礎理論與配置,這一章將介紹在各種不同場景下的不同使用方法一靜態資源服務靜態資源類型非服務器動態運行生成的文件,換句話說,就是可以直接在服務器上找到對應文件的請求瀏覽器端渲染圖片視頻文件,任意下載文件靜態資源服務場景什么是例 上一章了解了nginx的基礎理論與配置,這一章將介紹nginx在各種不同場景下的不同使用方法 一、靜態資源WEB服務 1.靜態資源類型 非服務器動態...
摘要:合適和夠用是最完美的追求。比如從頁面去請求的資源。它允許瀏覽器向跨源服務器,發出請求,從而克服了只能同源使用的限制。定義在中的路由都是無狀態的,并且會應用中間件組。 關于作者 程序開發人員,不拘泥于語言與技術,目前主要從事PHP和前端開發,使用Laravel和VueJs,App端使用Apicloud混合式開發。合適和夠用是最完美的追求。 個人網站:http://www.linganm...
閱讀 2572·2021-09-23 11:21
閱讀 1882·2021-09-22 15:15
閱讀 970·2021-09-10 11:27
閱讀 3440·2019-08-30 15:54
閱讀 651·2019-08-30 15:52
閱讀 1335·2019-08-30 15:44
閱讀 2349·2019-08-29 15:06
閱讀 2972·2019-08-28 18:21