android에서만 network request failed 에러가 나는 경우 with react native

에러 상황

저번주에 퇴근하려는데.. 갑자기 이런 에러가 생겼다.

그 당시에 에러에 대해서 명확히 정의하기가 힘들었어서, 다른 rn 개발자들은 이 글을 보고 바로 퇴근하셨으면 좋겠어서 올린다.

---

에러상황

브라우저: 정상작동

ios: 정상작동

android: network request failed error

mac os terminal: gql codegen시 graphql codegen Unable to verify first certificate

---

접근

왠지 인증서 문제같은데.. 브라우저랑 ios에서는 정상작동하니까 확신을 하기가 힘들었다.

그러던중 아래의 링크를 발견했다.

안드로이드에서만 network request failed error

 

1. flipper에서 network plugin 이슈일 경우 x

이건 내 경우에는 아니었다.

 

2. ssl/tls 인증서 문제일 경우 o

왠지 이거일것 같아서 sslabs에서 인증서 테스트를 해보았다.

서버에서 내려주는 인증서 chain이 불완전했음

서버에서 체인을 불완전하게 내려주는 부분에서 문제가 생긴것 같았다..

---

해결

백앤드분께 여쭤봤더니 이게 문제가 있을수 있다고 해서 인프라팀에 문의를 했다.

인프라팀에서 인증서 체인을 만들때 실수가 있었다고 했고 수정했더니 동작했다!ㅎ

---

궁금증

1. 왜 ios랑 브라우저에서는 동작하는데 안드로이드에서만 동작을 하지 않을까??..

 

The behavior you saw is due to a functionality called AIA chasing that is implemented by some browsers and user agents (including Safari on iOS). A certificate can have a value for the Authority Information Access extension that can be used by browsers or underlying frameworks to build the complete certificate chain by fetching intermediates if they are not supplied by the server. Android does not do AIA chasing which is why you saw the error when calling the API from the Android app. I haven't been able to find out why this isn't built into Android. The correct way to address this is to make sure the web server provides the necessary intermediate certificates to connecting clients.

 

 

client 중에서 aia chasing을 통해서 빈 중간인증서를 채워주는 동작을 하는데, 모든 client에서 지원하는건 아닌듯하다. 밑의 링크를 읽어보면 더 이해가 될듯.

https://www.thesslstore.com/blog/aia-fetching/

AIA Fetching: Solving a Common SSL Misconfiguration

---

이번 에러를 분석해보면서 백앤드분과 인프라에 있으신 분들께 기본적인 지식들을 많이 여쭤봤었는데 친절하게 알려주셨다.

이를 통해 몰랐던 기본지식들을 대략적으로 이해할수 있었다.

 

그리고 prod서버가 아니라 dev여서 다행이었다.