[Vuejs]-I got No 'Access-Control-Allow-Origin' header is present on the requested resource error

-1👍

It is because you want to access a remote location http://local-backend-currencies.com from your localhost via JS – and this is prohibited.

To call the login you should call http://localhost:8080/login. I tink you call the Laravel backend from your local development env localhost:8080 – which is a bad idea.

I am unsure how CORS is set up in your application, what package you use for it, but if really everything is ok you should allow localhost:8080. If you use Laravel 7+ see the docs about this.

-1👍

One easiest way to do this is by adding this code to the beginning of your API route file (api.php)

//header parameters to allow external server to access
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, Accept, X-Requested-With');

-1👍

I ran into similar issues (I had set everything correctly in the cors.php file) and in my case, the fix was as follows:

  1. Before anything else, rung: php artisan optimize

  2. I had dd() in my code which was breaking the Middleware flow.

    Ref: If you echo(), dd(), die(), exit(), dump() etc in your code, you will break the Middleware flow.

  1. Another case: My bootstrap/cache folder didn’t have proper permissions. I updated permission to 775 which fixed the issue for me.

    chmod 775 bootstrap/cache -R

    php artisan optimize

  2. Also, I made sure that there is no additional Access-Control-Allow-Origin present in the .htaccess file.

Leave a comment