Laravel API - AngularJS: Access-Control-Allow-Origin error

Question

Hello stackoverflowers!

I have a hard time to get Angular and Laravel working together. I want to use Angular separately from Laravel. I have setup 2 domains app.domain.com and api.domain.com using forge. When i want to send requests from my app.domain.com or localhost to my api.domain.com i got a 'Access-Control-Allow-Origin' (=CORS?) error.

Error:

XMLHttpRequest cannot load http://api.domain.com/api/authenticate. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8888' is therefore not allowed access.

I googled for hours but i can't figure it out. I already tried adding CORS middleware to Laravel but that has no effect.

{
        return $next($request)
            ->header('Access-Control-Allow-Origin', '*')
            ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS')
            ->header('Access-Control-Max-Age', '1000')
            ->header('Access-Control-Allow-Headers', 'Content-Type, Authorization, X-Requested-With');
}

Error is still being showed. The weird part is that get request are allowed, only post requests are not allowed for some reason.

Normally i use APACHE as server but Laravel Forge is using nginx. Does this has something todo with nginx?

My nginx config file:

server {
listen 80;
server_name api.domain.be;
root /home/forge/api.domain.be/public;

# FORGE SSL (DO NOT REMOVE!)
# ssl_certificate;
# ssl_certificate_key;

ssl_protocols TLSv1 TLSv1.1 TLSv1.2;

index index.html index.htm index.php;

charset utf-8;

location / {
    try_files $uri $uri/ /index.php?$query_string;
}

location = /favicon.ico { access_log off; log_not_found off; }
location = /robots.txt  { access_log off; log_not_found off; }

access_log off;
error_log  /var/log/nginx/api.onlinevaten.be-error.log error;

error_page 404 /index.php;

location ~ \.php$ {
    fastcgi_split_path_info ^(.+\.php)(/.+)$;
    fastcgi_pass unix:/var/run/php5-fpm.sock;
    fastcgi_index index.php;
    include fastcgi_params;
}
location ~ /\.ht {
    deny all;
}

}

Can anyone help me out? Would be awesome!

I had the same error i resolved

user5621153
– user5621153

2015-12-18 13:10:53 +00:00
Commented Dec 18, 2015 at 13:10 — user5621153
– user5621153, Commented Dec 18, 2015 at 13:10

user5621153 · Accepted Answer · 2015-12-18 13:13:21Z

2

Try This , it worked well for me

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

answered Dec 18, 2015 at 13:13

user5621153

Sign up to request clarification or add additional context in comments.

5 Comments

user2227400 Over a year ago

There are also Plugins for Firefox (addons.mozilla.org/en-US/firefox/addon/cors-everywhere) and for Chrome (chrome.google.com/webstore/detail/allow-control-allow-origi/…) to ignore these restrictions on the client side.

user5621153 Over a year ago

But every end user needs to install the plugin in their browser know , so we can handle the things in server itself know

Jornve Over a year ago

Thanks for the fast respons Niyaz. Do i have to replace my code with your code in laravel? Or is this a nginx config adjustment?

user5621153 Over a year ago

I have not used ngix things , i did this code in the index.php, replace and check it will definitely work i too had the same cors issue when i call from client angular js to laravel api

Jornve Over a year ago

Ok thanks, deploying now! hopefully it will work :)

Collectives™ on Stack Overflow

Laravel API - AngularJS: Access-Control-Allow-Origin error

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related