API Gateway에 연결되지 않습니다 ...

소개

평소, 주로 프런트 엔드를 만지고 있습니다만, 연결되지 않거나, 예상외의 거동을 하거나 자주 파닉하므로 비망록적으로 정리합니다.
그 밖에도 이런 빠져 포인트가 있었던 것 같은 이야기 기다리고 있습니다

1. Missing Authentication Token...???

사건

인증없이 설정하거나 Authentication 토큰을 헤더에 채우고 적절하게 요청하고 싶지만 평생 이것이 반환됩니다.

원인

API를 배포하지 않았습니다.
처음부터 어쩔 수 없는 실수로 죄송합니다만, 정말 잘 하기 때문에. .
리소스를 변경한 후 배포해 봅시다.

2. No 'Access-Control-Allow-Origin' header is present on the requested resource.

사건

통신에 실패하고 인스펙터를 보면 어쨌든 빨간색 문자로 제목과 같은 메시지가 표시됩니다.

원인

CORS 설정이 적절하지 않았습니다.

CORS는 Cross-Origin Resource Sharing의 약자입니다.
현재의 브라우저에서는, 크로스 사이트 스크립팅을 방지하기 위해(때문에), 특정의 조건의 때를 제외하고 (단순 리퀘스트라고 불립니다. 참고: 오리진 간 리소스 공유(CORS) ), 프리 플라이트 리퀘스트라고 하는 것을 실제의 리퀘스트 전에 실시해, 그 응답에 따라서 HTML을 취득한 서버 이외로부터 데이터를 취득하는 것을 거부하게 되어 있습니다.

따라서 API Gateway를 사용하는 경우 CORS를 활성화하고 적절하게 설정해야합니다.
즉, 이번 메시지는 허용되지 않는 헤더가 요청에 포함되어 있고 오류가 발생했다는 것을 나타냅니다.

주요 HTTP 응답 헤더는 다음과 같습니다.

HTTP 헤더 이름
설명

Access-Control-Allow-Headers
실제 요청에 허용되는 헤더 지정

Access-Control-Allow-Methods
실제 요청에 허용되는 HTTP 메소드 지정

Access-Control-Allow-Origin
요청을 허용하는 오리진 지정

예를 들면, 이런 느낌.