Laravel 浏览器跨域

在前后端分离的 Laravel 项目中, 客户端程序程序和服务器代码在不同域名或是不同端口运行下时, 会涉及跨域问题, 由于浏览器的同源策略，跨域请求非法, 这里可能需要做一些设置

同源策略是Web应用程序安全模型中的一个重要概念。根据该策略，Web浏览器允许第一个Web页面中包含的脚本访问第二个Web页面中的数据，但前提是两个Web页面具有相同的源。原点定义为URI方案，主机名和端口号的组合。此策略可防止一个页面上的恶意脚本通过该页面的文档对象模型访问另一个网页上的敏感数据。

方案一: laravel-Cors

偷懒的话, composer 拉个包就行, 在终端执行安装命令如下：

composer require barryvdh/laravel-cors

具体教程移步: github: laravel-Cors

方案二: 中间件

通常, 跨域时, 几个 header 头默认会有限制策略, 这里在每个 http 请求时, 都过滤一遍即可. 由于 laravel 的请求可以设置必须经由某个中间件, 所以这里写一个中间件即可.

1. 新建一个中间件

php artisan make:middleware CrossMiddleware

2. 中间件逻辑

namespace App\Http\Middleware;
use Closure;

class CrossMiddleware
{
    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, multipart/form-data, application/json');
//        $response->header('Access-Control-Allow-Headers', '*');
        $response->header('Access-Control-Allow-Methods', 'GET, POST, PATCH, PUT, OPTIONS, DELETE');
        $response->header('Access-Control-Allow-Credentials', 'false');

        return $response;
    }
}

这里介绍以下每个参数的意义:

3. 注册该中间件

在 App\Http\Kernel 类的 $middleware 中添加全局中间件

class Kernel extends HttpKernel
{
    protected $middleware = [
        // ...
        \App\Http\Middleware\CrossMiddleware::class,//跨域
    ];

之后跨域就被许可了, 但是请求过程中, 会多发送一个 options 方法的请求, 判断服务器是否允许跨域操作.

以上~

本作品采用《CC 协议》，转载必须注明作者和本文链接