Laravel CORS Проблема при работе с файлами изображений в общей папке? - PullRequest
Новая
       54

Laravel CORS Проблема при работе с файлами изображений в общей папке?

0 голосов
/ 22 октября 2019

Поэтому я храню изображения в своей общедоступной папке в подкаталоге с именем images, и я пытаюсь сделать запрос к одному из них.

Однако я постоянно получаю сообщение об ошибке; 

Access to fetch at 'http://project.test/images/4obrUhRprw6CXSHsHEGEf4Gje2baKoiS7PQJvS4F.jpeg' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Я думаю, это потому, что я использую VueJS в качестве внешнего интерфейса SPA, как будто я направляюсь к project.test и делаю запрос, он работает нормально.

Я использую laravel-corsно после некоторого исследования я обнаружил, что это, очевидно, не относится к общедоступной папке, поэтому я попытался поиграться с файлом .htaccess в общедоступной папке, и вот что у меня есть; 

<IfModule mod_rewrite.c>
    <IfModule mod_negotiation.c>
        Options -MultiViews -Indexes
    </IfModule>

    <IfModule mod_headers.c>
        SetEnvIf Origin "http(s)?://([^.]+\.)?(localhost:8080)$" AccessControlAllowOrigin=$0$1
        Header add Access-Control-Allow-Origin %{AccessControlAllowOrigin}e env=AccessControlAllowOrigin
        Header set Access-Control-Allow-Credentials true
    </IfModule>


    RewriteEngine On

    # Handle Authorization Header
    RewriteCond %{HTTP:Authorization} .
    RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]

    # Redirect Trailing Slashes If Not A Folder...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} (.+)/$
    RewriteRule ^ %1 [L,R=301]

    # Handle Front Controller...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [L]
</IfModule>

Тем не менее, он по-прежнему не работает, и я получаю ту же ошибку при выполнении запроса от моего локального хоста Vue вместо project.test. Я должен также отметить, что я использую Valet.

Надеюсь, кто-то может помочь с этим.

1 Ответ

1 голос
/ 22 октября 2019

Добавление промежуточного программного обеспечения с помощью CORS 

<?php
namespace App\Http\Middleware;

use Illuminate\Foundation\Http\Middleware\CheckForMaintenanceMode as Middleware;
use Closure;
use Illuminate\Support\Facades\Response;

class CORS extends Middleware {

    /**
     * Handle an incoming request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Closure  $next
     * @return mixed
     */
    public function handle($request, Closure $next)
    {            
        $origin = $request->header('origin');
        $origin = $origin ?? '*';

        // ALLOW OPTIONS METHOD
        $headers = [
            'Access-Control-Allow-Origin' => $origin,
            'Access-Control-Allow-Methods'=> 'GET, POST, DELETE, PUT, OPTIONS, HEAD, PATCH',
            'Access-Control-Allow-Headers'=> 'Authorization,DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Set-Cookie',
            'Access-Control-Allow-Credentials'=> 'true'
        ];

        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;
    }

}

Файл приложения / Http / Kernel.php 

protected $middleware = [
        // Your middleware...

        \App\Http\Middleware\CORS::class,        
    ];
...