執行個體解析laravel跨域功能開啟方法

出於安全性的原因，瀏覽器會限制 Script 中的跨域請求。由於 XMLHttpRequest 遵循同源策略，所有使用 XMLHttpRequest 構造 HTTP 要求的應用只能訪問自己的網域名稱，如果需要構造跨域的請求，那麼開發人員需要配合瀏覽器做出一些允許跨域的配置。

本文主要給大家介紹了關於laravel如何開啟跨域功能的相關資料，文中通過範例程式碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，希望能協助到大家。

W3C 應用工作群組推薦了一種跨資源共用的機制，這種機制讓 Web 應用程式伺服器能支援跨站存取控制，從而使得安全的進行跨站資料轉送成為可能，該機制通過幾種方式來對原有模式進行了擴充：

• 響應的頭部應該追加 Access-Control-Allow-Orign，用來表明哪些請求源被允許訪問資源內容

• 瀏覽器會對請求源和響應中的值進行匹配驗證

• 對於跨域的請求，瀏覽器會預發送一個非簡單方式的請求，來判斷給定資源是否準備接受跨域資源訪問

• 服務端應用通過檢查要求標頭部的 Orign 來判定請求是否跨域。

跨源資源共用標準

跨源資源共用標準通過新增一系列 HTTP 頭，讓伺服器能聲明哪些來源可以通過瀏覽器訪問該伺服器上的資源。另外，對哪些會對伺服器資料造成破壞性響應的 HTTP 要求方法（特別是 GET 以外的 HTTP 方法，或者搭配某些 MIME 類型的 POST 請求），標準強烈要求瀏覽器必須先以 OPTIONS 請求方式發送一個預請求（preflight request），從而擷取知伺服器端對跨源請求所支援 HTTP 方法。在確認伺服器允許跨源請求的情況下，以實際的 HTTP 要求方法發送那個真正的請求。伺服器端也可以通知用戶端，是不是需要隨同請求一起發送信用資訊（包括 Cookies 和 HTTP 認證相關資料）。

跨源共用標準需要瀏覽器和服務端共同配合才能完成，目前瀏覽器廠商已經可以將請求部分自動完成，所以跨源資源訪問的重點還是在於伺服器端。

下面列出一些標準中可用的回應標頭和要求標頭。

Response Header

• Access-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 Header

• Origin : 表明發送請求或預請求的來源。

• Access-Control-Request-Method : 在發送預請求時帶該要求標頭，表明實際的請求將使用的請求方式。

• Access-Control-Request-Headers : 在發送預請求時帶有該要求標頭，表明實際的請求將攜帶的要求標頭。

中介軟體

在 Laravel 中允許跨域請求，我們可以構建一個追加響應的中介軟體，用來添加專門處理跨域的請求的回應標頭:

<?php namespace App\Http\Middleware;use Closure;use Response;class EnableCrossRequestMiddleware { /** * Handle an incoming request. * * @param \Illuminate\Http\Request $request * @param \Closure $next * @return mixed */ public function handle($request, Closure $next) { $response = $next($request);  $response->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 不能指定為 *

• 後置中介軟體只有在正常響應時才會被追加回應標頭，而如果出現異常，這時響應是不會經過中介軟體的。