Question 286438 in Laravel Question posted in
The official Laravel Documentation can be found here.

The Laravel CORS policy prevents network images from displaying in flutter web

I’m a flutter developer and I’m using laravel framework for the back-end and when I’m trying to load network images in live mode, I get the following error:

Access to XMLHttpRequest at 'https://haya.stop-ea.com/storage/car-brands/Chevrolet.png' from origin 'https://admin.stop-ea.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

and I tried a lot of solutions I found on google but nothing worked. May I get help, please?

Tags:

2

Answers


  1. 0

    install this package
    composer require fruitcake/laravel-cors

    To allow CORS for all your routes, add the HandleCors middleware at the top of the $middleware property of app/Http/Kernel.php class:

    protected $middleware = [
  FruitcakeCorsHandleCors::class,
    // ...
];
    Login or Signup to reply.
  2. 0

    When you run your code in development/locally, you will always request from the same IP as the server uses. Which makes CORS requests work (because of it not being cross-origin).
    To allow your API to be used by clients from outside the localhost, you will have to either handle the cors headers in the webserver, or by adding the IlluminateHttpMiddlewareHandleCors middleware to the app/Http/Kernel.php $middleware array.

    The HandleCors middleware will add the required CORS headers and by that, allowing the client to work with the API as intended.

    Now, when it comes to CORS, you might actually want to limit what origins that you wish to allow to access the site, so Laravel supplies a configuration for the middleware which looks like this:

    config/cors.php

    <?php
return [
    'paths' => [],
    'allowed_methods' => ['*'],
    'allowed_origins' => ['*'],
    'allowed_origins_patterns' => [],
    'allowed_headers' => ['*'],
    'exposed_headers' => [],
    'max_age' => 0,
    'supports_credentials' => false,
];

    There are a few important settings you might want to change. For example, without the supports_credentials set to true, a lot of clients wont be able to send any Auth headers to your API (which you might want).
    The paths array might also be something you wish to populate with the paths that you actually want to expose with cors headers active.

    So, in short (if the default config is enough), all you have to do is add the HandleCors middleware:

    App/Http/kernel.php

    ...
protected $middleware = [
    ...
    HandleCors::class,
];
...

    Or, alternatively, to a middleware group (if it’s only supposed to be used for the api for example.

    Worth noting is that CORS is handled client-side. So not all clients (although most browsers) even cares about them. That means that CORS is not a good way to limit access to the API, that is done by Authz and Authn. Cors is basically just a security setting for the client.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search