如何解决 Laravel 中的“Access-Control-Allow-Origin”问题？答案

【问题标题】：How to fix 'Access-Control-Allow-Origin' issue in Laravel?如何解决 Laravel 中的“Access-Control-Allow-Origin”问题？
【发布时间】：2019-06-18 23:26:33
【问题描述】：

我有一个 Laravel 项目，现在我需要一个图片下载功能来下载我已经通过我的项目上传到亚马逊的图片。设置下载功能和下载按钮以下载特定图像后，控制台显示以下错误。

无法加载“image-url”：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，不允许访问 Origin 'localhost-virtual-servel'。

这是从stackoverflow中找到的下载函数：

<a class="download-btn" data-href="image-url" download><span class="a2a_svg"></span></a>

function forceDownload(link){
    var url = link.getAttribute("data-href");
    var fileName = link.getAttribute("download");
    link.innerText = "Working...";
    var xhr = new XMLHttpRequest();
    xhr.open("GET", url, true);
    xhr.responseType = "blob";
    xhr.onload = function(){
        var urlCreator = window.URL || window.webkitURL;
        var imageUrl = urlCreator.createObjectURL(this.response);
        var tag = document.createElement('a');
        tag.href = imageUrl;
        tag.download = fileName;
        document.body.appendChild(tag);
        tag.click();
        document.body.removeChild(tag);
        link.innerText="Download Image";
    }
    xhr.send();
}

我创建了一个中间件将“Allow-access-control-Origin”标头设置为全部（*），如下所示

中间件：

<?php

namespace App\Src\Modules\Common\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)
    {
        header("Access-Control-Allow-Origin: *");

        // ALLOW OPTIONS METHOD
        $headers = [
            'Access-Control-Allow-Methods'=> 'POST, GET, OPTIONS, PUT, DELETE',
            'Access-Control-Allow-Headers'=> 'Content-Type, X-Auth-Token, Origin'
        ];
        if($request->getMethod() == "OPTIONS") {
            // The client-side application can set only headers allowed in Access-Control-Allow-Headers
            return Response::make('OK', 200, $headers);
        }

        $response = $next($request);
        foreach($headers as $key => $value)
            $response->header($key, $value);
        return $response;
    }

}

内核.php：

protected $routeMiddleware = [
        'cors' => \App\Src\Modules\Common\Middleware\cors::class,
    ];

路线：

Route::get('my_page', array('middleware' => 'cors', 'as'=>'my.page-get','uses'=>'MyController@getMyPage'));

但错误仍然存在。我该如何解决这个问题？？

【问题讨论】：

请求的资源 (Amazon) 应该具有该标头。 “请求的资源上没有 'Access-Control-Allow-Origin' 标头。”
请参考下面的链接，这应该可以解决您的问题。 stackoverflow.com/questions/39429462/…

标签： php jquery laravel cors

【解决方案1】：

将此代码放在 routes/api.php 的顶部，或者如果您在 routes/web.php 中编写了您的路由

 use Illuminate\Http\Request;

   header('Access-Control-Allow-Origin:  *');
   header('Access-Control-Allow-Methods:  POST, GET, OPTIONS, PUT, DELETE');
   header('Access-Control-Allow-Headers:  Content-Type, X-Auth-Token, Origin, Authorization');

它会为你工作的。

【讨论】：

我在 Routes.php 中使用了路由。我添加了这些代码，但出现了同样的错误！
将此添加到您的根 .htaccess 文件中。标头设置 Access-Control-Allow-Origin "" RewriteEngine On RewriteCond %{HTTP:Authorization} 。重写规则。 - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
公共函数句柄($request, Closure $next) { if ($request->isMethod('OPTIONS')) { app()->options($request->path(), function () { 返回响应('', 200); }); } $response = $next($request); $response->header('Access-Control-Allow-Methods', 'HEAD, GET, POST, PUT, PATCH, DELETE'); $response->header('Access-Control-Allow-Headers', $request->header('Access-Control-Request-Headers')); $response->header('Access-Control-Allow-Origin', '*');返回$响应； }

【解决方案2】：

尝试添加 header("Access-Control-Allow-Origin: *");也在你的 $headers 数组中。

【讨论】：