Laravel开启跨域请求的方法

吾爱主题阅读：146 2021-09-01 15:39:00 评论：0

项目中用到了接口，外部调用的时候老是请求不到，本地请求却没问题，查了下说是因为跨域的问题。

根据网上所说解决方法如下：

1、建立中间件Cors.php

命令：php artisan make:middleware Cors

在/app/Http/Middleware/ 目录下会出现一个Cors.php 文件。

2、在handle 方法中加入如下内容：

1 2 3 4 5 6 $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-Methods' , 'GET, POST, PATCH, PUT, OPTIONS' ); $response ->header( 'Access-Control-Allow-Credentials' , 'false' ); return $response ;

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

对于跨域访问并需要伴随认证信息的请求，需要在 XMLHttpRequest 实例中指定 withCredentials 为 true。

这个中间件你可以根据自己的需求进行构建，如果需要在请求中伴随认证信息（包含 cookie，session）那么你就需要指定 Access-Control-Allow-Credentials 为 true, 因为对于预请求来说如果你未指定该响应头，那么浏览器会直接忽略该响应。

在响应中指定 Access-Control-Allow-Credentials 为 true 时，Access-Control-Allow-Origin 不能指定为 *（这个一定要注意，我就是在这个地方调了好久）

后置中间件只有在正常响应时才会被追加响应头，而如果出现异常，这时响应是不会经过中间件的。

Cors.php文件内容如下：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 <?php namespace App\Http\Middleware; use Closure; 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, multipart/form-data, application/json' ); $response ->header( 'Access-Control-Allow-Methods' , 'GET, POST, PATCH, PUT, OPTIONS' ); $response ->header( 'Access-Control-Allow-Credentials' , 'false' ); return $response ; } }

3、在 Kernel.php文件中的$middleware中加入刚刚添加的中间件：\App\Http\Middleware\Cors::class,

如：

1 2 3 4 5 6 7 8 protected $middleware = [ \Illuminate\Foundation\Http\Middleware\CheckForMaintenanceMode:: class , \App\Http\Middleware\EncryptCookies:: class , \Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse:: class , \Illuminate\Session\Middleware\StartSession:: class , \Illuminate\View\Middleware\ShareErrorsFromSession:: class , \App\Http\Middleware\Cors:: class , ];

以下内容为网络摘抄：

跨源资源共享标准

跨源资源共享标准通过新增一系列 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 : 指明预请求中的哪些头信息可以用于实际的请求中。