AWS APIGateway CORS(크로스 오리진 리소스 공유) 화면 콘솔이 이상한 이야기
3372 단어 CORSAPIGatewayAWS
요약
AWS의 APIGateway를 이용하여 API를 만들게 되고,
만져 보면 APIGateway의 화면 콘솔에서 버그가 아닌가요? 라는
물건을 찾았습니다.
결론부터 말하면
"크로스 오리진 리소스 공유"는 화면에서 만지지 마라! ![:smirk:](https://s1.md5.ltd/image/be7537b6e418c5bcbde1132a8b835bd7.png)
라는 것입니다.
※「HTTP API」「Lambda 프록시 통합」이용의 경우의 이야기가 됩니다.
이 녀석입니다!
![](https://s1.md5.ltd/image/c8c18d8ef0a5a12c21dfc2dd9429c3be.png)
1. 전제
원래, "Lambda 프록시 통합"을 사용하면,
CORS 설정은 직접 수행해야 하는 인식입니다.
AWS APIGateway + Lambda 프록시 통합을 사용하여 CORS 설정에 빠진 이야기
Lambda 측에서 APIGateway를 설정하면 설정 확인란이 표시되지만 작동하지 않습니다.
(독자적으로 response에 기재한 Header가, 덧쓰기되기 (위해)때문에, 반환되지 않게 됩니다.)
![](https://s1.md5.ltd/image/6c06ff28b560f514913412c8441f95c2.png)
2. 재미있는 패턴
![](https://s1.md5.ltd/image/c8c18d8ef0a5a12c21dfc2dd9429c3be.png)
의 화면을 「편집」하고, 각종 CORS의 설정을 흥미 본위로 접해 봅니다.
그냥 원래 설정으로 되돌립니다.
※상술한 바와 같이, 「Lambda 통합」을 하고 있는 한,
본 장소에서 CORS 설정은 무시되므로 설정해도 효과가 없습니다.
![](https://s1.md5.ltd/image/538a9c528e97b055a2d0be0b85df596e.png)
그래서 모두 확인하면서 원래 화면의 상태로 되돌립니다.
3. 아, CORS 오류가 발생합니다. . . ?
그렇다면 설정을 내보낼 수 있으므로 config를 살펴 보겠습니다.
![](https://s1.md5.ltd/image/8601fdb3c188e80ad2305019429c2f88.png)
무려, 여기의 설정 와서 네- 아니야-! ! (゚д゚)!
![](https://s1.md5.ltd/image/f4eb88e812158d7c52814a0f86d26e3e.png)
화면의 사양상,
Access-Control-Max-Age, Access-Control-Allow-Credentials
그러나,
「x-amazon-apigateway-cors」의 정보는 사라지지 않는 것 같네요.
이때의 상태입니다만,
크로스 오리진 리소스 공유 화면은 초기 표시와 상관없이,
Lambda 측의 APIGateway 관련 설정을 보더라도 CORS 설정이 "NO"로 보입니다.
![](https://s1.md5.ltd/image/3dba990569ea33a30a422ca236192801.png)
4. 회피 방법
내보낸 정의를 화면에 붙여 넣으면 다시 가져올 수 있습니다.
그러므로, Export된 것을 copipe로 붙이고,
"x-amazon-apigateway-cors"값을 삭제하고 캡처하면 CORS 설정이 삭제됩니다.
(Lambda로 기재한 실장측의 header가 돌려주게 된다.)
![](https://s1.md5.ltd/image/6b06da82233ed011f1088ca5ed7638df.png)
여러분도 쾌적한 APIGateway&Lambda 생활을!
Reference
이 문제에 관하여(AWS APIGateway CORS(크로스 오리진 리소스 공유) 화면 콘솔이 이상한 이야기), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/maechi/items/4e8c43a2bcb0d20047b2
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
원래, "Lambda 프록시 통합"을 사용하면,
CORS 설정은 직접 수행해야 하는 인식입니다.
AWS APIGateway + Lambda 프록시 통합을 사용하여 CORS 설정에 빠진 이야기
Lambda 측에서 APIGateway를 설정하면 설정 확인란이 표시되지만 작동하지 않습니다.
(독자적으로 response에 기재한 Header가, 덧쓰기되기 (위해)때문에, 반환되지 않게 됩니다.)
![](https://s1.md5.ltd/image/6c06ff28b560f514913412c8441f95c2.png)
2. 재미있는 패턴
![](https://s1.md5.ltd/image/c8c18d8ef0a5a12c21dfc2dd9429c3be.png)
의 화면을 「편집」하고, 각종 CORS의 설정을 흥미 본위로 접해 봅니다.
그냥 원래 설정으로 되돌립니다.
※상술한 바와 같이, 「Lambda 통합」을 하고 있는 한,
본 장소에서 CORS 설정은 무시되므로 설정해도 효과가 없습니다.
![](https://s1.md5.ltd/image/538a9c528e97b055a2d0be0b85df596e.png)
그래서 모두 확인하면서 원래 화면의 상태로 되돌립니다.
3. 아, CORS 오류가 발생합니다. . . ?
그렇다면 설정을 내보낼 수 있으므로 config를 살펴 보겠습니다.
![](https://s1.md5.ltd/image/8601fdb3c188e80ad2305019429c2f88.png)
무려, 여기의 설정 와서 네- 아니야-! ! (゚д゚)!
![](https://s1.md5.ltd/image/f4eb88e812158d7c52814a0f86d26e3e.png)
화면의 사양상,
Access-Control-Max-Age, Access-Control-Allow-Credentials
그러나,
「x-amazon-apigateway-cors」의 정보는 사라지지 않는 것 같네요.
이때의 상태입니다만,
크로스 오리진 리소스 공유 화면은 초기 표시와 상관없이,
Lambda 측의 APIGateway 관련 설정을 보더라도 CORS 설정이 "NO"로 보입니다.
![](https://s1.md5.ltd/image/3dba990569ea33a30a422ca236192801.png)
4. 회피 방법
내보낸 정의를 화면에 붙여 넣으면 다시 가져올 수 있습니다.
그러므로, Export된 것을 copipe로 붙이고,
"x-amazon-apigateway-cors"값을 삭제하고 캡처하면 CORS 설정이 삭제됩니다.
(Lambda로 기재한 실장측의 header가 돌려주게 된다.)
![](https://s1.md5.ltd/image/6b06da82233ed011f1088ca5ed7638df.png)
여러분도 쾌적한 APIGateway&Lambda 생활을!
Reference
이 문제에 관하여(AWS APIGateway CORS(크로스 오리진 리소스 공유) 화면 콘솔이 이상한 이야기), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/maechi/items/4e8c43a2bcb0d20047b2
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
그렇다면 설정을 내보낼 수 있으므로 config를 살펴 보겠습니다.
![](https://s1.md5.ltd/image/8601fdb3c188e80ad2305019429c2f88.png)
무려, 여기의 설정 와서 네- 아니야-! ! (゚д゚)!
![](https://s1.md5.ltd/image/f4eb88e812158d7c52814a0f86d26e3e.png)
화면의 사양상,
Access-Control-Max-Age, Access-Control-Allow-Credentials
그러나,
「x-amazon-apigateway-cors」의 정보는 사라지지 않는 것 같네요.
이때의 상태입니다만,
크로스 오리진 리소스 공유 화면은 초기 표시와 상관없이,
Lambda 측의 APIGateway 관련 설정을 보더라도 CORS 설정이 "NO"로 보입니다.
![](https://s1.md5.ltd/image/3dba990569ea33a30a422ca236192801.png)
4. 회피 방법
내보낸 정의를 화면에 붙여 넣으면 다시 가져올 수 있습니다.
그러므로, Export된 것을 copipe로 붙이고,
"x-amazon-apigateway-cors"값을 삭제하고 캡처하면 CORS 설정이 삭제됩니다.
(Lambda로 기재한 실장측의 header가 돌려주게 된다.)
![](https://s1.md5.ltd/image/6b06da82233ed011f1088ca5ed7638df.png)
여러분도 쾌적한 APIGateway&Lambda 생활을!
Reference
이 문제에 관하여(AWS APIGateway CORS(크로스 오리진 리소스 공유) 화면 콘솔이 이상한 이야기), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/maechi/items/4e8c43a2bcb0d20047b2
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
Reference
이 문제에 관하여(AWS APIGateway CORS(크로스 오리진 리소스 공유) 화면 콘솔이 이상한 이야기), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/maechi/items/4e8c43a2bcb0d20047b2텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)