Laravel 跨域解决方案

• 2020 年 2 月 12 日
• 笔记

我们在用 laravel 进行开发的时候，特别是前后端完全分离的时候，由于前端项目运行在自己机器的指定端口 (也可能是其他人的机器) ， 例如 localhost:8000 , 而 laravel 程序又运行在另一个端口，这样就跨域了，而由于浏览器的同源策略，跨域请求是非法的。其实这个问题很好解决，只需要添加一个中间件就可以了。

1. 新建一个中间件 php artisan make:middleware EnableCrossRequestMiddleware
2. 书写中间件内容
   1. <?php
   2. namespace AppHttpMiddleware;
   3. use Closure;
   4. class EnableCrossRequestMiddleware
   5. {
   6. /**
   7. * Handle an incoming request.
   8. *
   9. * @param IlluminateHttpRequest $request
   10. * @param Closure $next
   11. * @return mixed
   12. */
   13. public function handle($request, Closure $next)
   14. {
   15. $response = $next($request);
   16. $origin = $request->server('HTTP_ORIGIN') ? $request->server('HTTP_ORIGIN') : '';
   17. $allow_origin = [
   18. 'http://localhost:8000',
   19. ];
   20. if (in_array($origin, $allow_origin)) {
   21. $response->header('Access-Control-Allow-Origin', $origin);
   22. $response->header('Access-Control-Allow-Headers', 'Origin, Content-Type, Cookie, X-CSRF-TOKEN, Accept, Authorization, X-XSRF-TOKEN');
   23. $response->header('Access-Control-Expose-Headers', 'Authorization, authenticated');
   24. $response->header('Access-Control-Allow-Methods', 'GET, POST, PATCH, PUT, OPTIONS');
   25. $response->header('Access-Control-Allow-Credentials', 'true');
   26. }
   27. return $response;
   28. }
   29. }

   $allow_origin 数组变量就是你允许跨域的列表了，可自行修改。

3. 然后在内核文件注册该中间件
   1. protected $middleware = [
   2. // more
   3. AppHttpMiddlewareEnableCrossRequestMiddleware::class,
   4. ];

   在 AppHttpKernel 类的 $middleware 属性添加，这里注册的中间件属于全局中间件。

然后你就会发现前端页面已经可以发送跨域请求了。