How to fix CORS on Nginx? - php

Question

I had a spa project which run frontend and backend using different port.
It can run successfully when I using php artisan serve.
But now I tried to run the laravel backend at nginx without php artisan serve.
# backend
server {
listen 3000 default_server;
listen [::]:3000 default_server;
root /usr/nextJs/nextTestBackend/public;
index index.php index.html index.htm index.nginx-debian.html;
server_name _;
location / {
try_files $uri $uri/ /index.php?$query_string;
}
location ~ \.php$ {
try_files $uri /index.php =404;
fastcgi_pass 127.0.0.1:9000;
fastcgi_index index.php;
fastcgi_buffers 16 16k;
fastcgi_buffer_size 32k;
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
#fixes timeouts
fastcgi_read_timeout 600;
include fastcgi_params;
}
}
After nginx start, 127.0.0.1:3000/api/GET/users can't access laravel backend.
It will shows the error:
Failed to load http://127.0.0.1:3000/api/GET/test: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://127.0.0.1' is therefore not allowed access. The response had HTTP status code 500.
How to fix it?
Even though I put this inside location{} it still get the same error.
add_header 'Access-Control-Allow-Origin' '*';
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';
add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';
By the way the api at laravel also had CORS middleware.
Route::middleware('cors')->get('/GET/users', 'UserController#read');