由於 CORS，從 AngularJS 到 Nodejs 的請求被拒絕

Question

我有一個 AngularJS/NodeJs Web 應用程序，我在 DigitalOcean 上使用 Nginx 作為伺服器，我也在使用 CloudFlare。

該網站啟動並運行沒有問題，1週前，我訪問該網站發現我的索引已更改為，

歡迎來到 Nginx！

如果您看到此頁面，則表示 nginx Web 伺服器已成功安裝並正在執行。需要進一步配置。

有關線上文件和支持，請參閱 nginx.org。 nginx.com 提供商業支援。

檢查了我的 Nginx 設定文件，我意識到配置完全沒有問題，所以我只是刪除了索引並將舊索引上傳回來網站已重新啟動並運行，但是，我無法再登錄，並且我相信我無法發出任何 api 請求。

當我嘗試登入時，我得到的只是來自控制台的這條訊息。

火狐瀏覽器

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://dev.website.com/api/auth/login.

（原因：CORS 標頭「Access-Control-Allow-Origin」遺失）。

鉻合金

存取 XMLHttpRequest 位於 'https://dev.supplieson.com/api/auth/login'從原點'http://dev.supplieson.com' 已被 CORS 政策阻止：對預檢請求的回應未通過存取控制檢查：請求的資源上不存在「Access-Control-Allow-Origin」標頭。

我的 Nginx 設定是這樣的

   server {
        listen 80 default_server;
        listen [::]:80 default_server;
        listen 443 ssl http2 default_server;
        listen [::]:443 ssl http2 default_server;

        root /usr/share/nginx/html;
        index index.html index.htm index.nginx-debian.html;

        #server_name supplieson.com www.supplieson.com;
        include snippets/self-signed.conf;
        include snippets/ssl-params.conf;

        location / {
                try_files $uri $uri/ /index.html =404;
        }

        location ~ ^/images/(.*) {
            alias /usr/share/nginx/api/supplieson_backend/images/$1;
        }

        location /api {
                proxy_pass http://127.0.0.1:3000;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
        }

        error_page 404 /custom_404.html;
        location = /custom_404.html {
                root /usr/share/nginx/html;
                internal;
        }

        error_page 500 502 503 504 /custom_50x.html;
        location = /custom_50x.html {
                root /usr/share/nginx/html;
                internal;
        }

        location ~*  \.(jpg|jpeg|png|gif|ico|css|js)$ {
            expires 1m;
        }
}

快遞應用程式

import cors from 'cors';

app.use((req, res, next) => {
  res.setHeader("Access-Control-Allow-Origin", "*");
  res.setHeader(
    "Access-Control-Allow-Headers",
    "Origin, X-Requested-With, Content-Type, Accept, Authorization"
  );
  res.setHeader(
    "Access-Control-Allow-Methods",
    "GET, POST, PATCH, PUT, DELETE, OPTIONS"
  );
  next();
});

app.use(cors());