NGINX blocked the request from frontend through backend and frontend are in the same domain but differs in port

I built a web application with node.js backend and vue as frontend on the cloud, by using nginx both backend and frontend are served in 80 port (backend) and 8080 port(web frontend). On the backend’s side, nginx will proxy the request to the node.js from 80 port tot 3000 port.

in the testing, the web frontend received a CORS

Access to XMLHttpRequest at `'http://app.example.com/api/v1/data/api/66cbdffaa897e430f375799d' from origin` 
'http://app.example.com:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

Initially I thought this CORS control happens on the node.js ‘s side, but I didn’t find anything wrong on the node.js server. then I shutdown the node.js server, and still found the CORS problem, it is likely that nginx blocked the request through CORS.

here is the nginx site config

 server {

        listen 80 default_server;
        listen [::]:80 default_server;
       # Default server configuration
         server_name http://app.example.com;
         location / {

              proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
              proxy_set_header Host $http_host;
              proxy_set_header X-Forwarded-Proto $scheme;
              proxy_pass http://127.0.0.1:3000; # SSL configuration
         }

         access_log /var/log/nginx/node-app-access.log;
         error_log /var/log/nginx/node-app-error.log;
 }

then i disable this kind of config by commenting the whole backend config section, and restart the nginx server.

There is no more CORS error but the failed request error

   GET http://app.example.com/api/v1/data/api/66cbdffaa897e430f375799d net::ERR_CONNECTION_REFUSED

So I can more or less confirm the CORS error is coming from nginx, but I have never seen it happening before, because most CORS error are usually in the node.js server side not on the nginx side. Not to mention, the frontend and backend are all in the same domain but different ports.

I followed some tutorial to add the headers to the nginx config as shown below.

 server {

        listen 80 default_server;
        listen [::]:80 default_server;
       # Default server configuration
         server_name http://app.kuangcc.com;
         location / {
             add_header 'Access-Control-Allow-Origin' '*' always;
             add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS' always;
             add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range' always;
             add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range' always;


              proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
              proxy_set_header Host $http_host;
              proxy_set_header X-Forwarded-Proto $scheme;
              proxy_pass http://127.0.0.1:3000; # SSL configuration
         }

         access_log /var/log/nginx/node-app-access.log;
         error_log /var/log/nginx/node-app-error.log;
 }

but still doesn’t work, any ideas