CORS로 인해 AngularJS에서 Nodejs로의 요청이 거부됩니다.

Question

저는 AngularJS/NodeJs 웹 앱을 가지고 있고 서버용 DigitalOcean에서 Nginx를 사용하고 있으며 CloudFlare도 사용하고 있습니다.

웹사이트는 아무 문제 없이 작동하고 있었습니다. 1주일 전에 웹사이트를 방문하여 내 색인이 다음으로 변경되었음을 확인했습니다.

nginx에 오신 것을 환영합니다!

이 페이지가 보이면 nginx 웹 서버가 성공적으로 설치되어 작동하고 있는 것입니다. 추가 구성이 필요합니다.

온라인 문서 및 지원은 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.supplison.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());