Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Laravel CORS Issue when dealing with image files inside public folder?

So I store images inside my public folder inside a subdirectory called 'images', and I'm trying to make a request to one of them.

However, I constantly get the error;

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.

I think this is because I'm using VueJS as an SPA frontend, as if I head to project.test and make the request it works fine.

I'm using laravel-cors but after some research, I've found that apparently doesn't apply to the public folder, so I've tried playing around with the .htaccess file inside of public and this is what I've got;

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

However, it still doesn't appear to work and I get the same error when making a request from my Vue localhost instead of project.test. I should also note I'm using Valet.

Hopefully someone can give some help on this.

like image 238
Borassign Avatar asked Oct 22 '19 01:10

Borassign


1 Answers

I put this line in .htaccess file:

Header always set Access-Control-Allow-Origin "*"

and it worked for me.

like image 50
Hadeel Mostafa Avatar answered Oct 10 '22 02:10

Hadeel Mostafa