Laravel增加CORS中間件完成跨域請求


原文地址:

跨域的請求

出於安全性的原因,瀏覽器會限制 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 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 中允許跨域請求,我們可以在app/Http/Middleware/文件夾下構建一個追加響應的中間件Cors.php,用來添加專門處理跨域的請求的響應頭:

<?php
namespace App\Http\Middleware;

use Closure;
use Response;
class Cors {

    /**
     * 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', '*');
        $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', 'false');
        return $response;
    }

}

使用中間件

在app/Http/Kernel.php文件中protected $routeMiddleware處增加'cors' => \App\Http\Middleware\Cors::class,。

kernel文件

需要跨域請求的路由:

Route::group(['middleware'=>'cors'], function() {
    Route::any('/send','SendController@index');
});

其中有以下需要注意的地方:

  • 對於跨域訪問並需要伴隨認證信息的請求,需要在 XMLHttpRequest 實例中指定 withCredentials 為 true。
  • 這個中間件你可以根據自己的需求進行構建,如果需要在請求中伴隨認證信息(包含 cookie,session)那么你就需要指定 Access-Control-Allow-Credentials 為 true, 因為對於預請求來說如果你未指定該響應頭,那么瀏覽器會直接忽略該響應。
  • 在響應中指定 Access-Control-Allow-Credentials 為 true 時,Access-Control-Allow-Origin 不能指定為 *
  • 后置中間件只有在正常響應時才會被追加響應頭,而如果出現異常,這時響應是不會經過中間件的。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM