AxiosError:Network Error 수정하기

로그인화면을 구현하면서

로그인 api 를 구축하는데 

계속~^^ ㅎㅎ 계속~ ㅎㅎ에러가 떴다 ...

 

자꾸 network Error 라고 뜨니 도대체 뭐가 문제인지 모르겠고 작동 자체가 안됐다 ㅠ

백엔드 분들께 물어봐도 서버자체는 postman 으로 작동을 잘 하고 있고 

엔드포인트도 정확하다고 하셔서....

내 문제 자체를 정확히 알 수 없었다. 

 

구글링을 하는 수밖에..ㅜ

 

구글링을 해보니 생각보다 많은 사람들이 이러한 오류를 겪어본것을 알 수 있었다.

해결방안이 굉장히 많았고 그 중 내가 시도한 몇가지만 정리해보자면

---

 

1. 서버포트가 열려있는지 확인

 

서버 자체에 접속이 안되어서

백엔드 개발자 분께 서버 열려있는지 확인을 해달라고 하였다.

url 자체가 작동하지 않았었는데 서버포트가 닫혀있던 문제였다. 첫 관문은 해결! ☀️

또한 이 관문에서 백엔드 분들과 소통을 많이 해야했다..

• url 포트가 안열려용-> 열어주심...
• url 주소 정확한가용..-> postman 에서 확인한번 해주심..
• 엔드포인트가 정확한지 확인절차-> ㅇㅇ 정확함
• 혹시 제가 POST/GET 을 헷갈린건 아니죠? -> ㅇㅇ 정확함

ㅋㅋㅋ너무 백엔드분들을 귀찮게 한건 아닌가 싶지만 

처음 연결은 어쩔 수 없다! 

2. 서버 작동하는지 확인해보기-curl 명령어 사용

자꾸 network error 가 뜨니... 

서버 자체에 접속이 안되는 건가 싶어서 curl 명령어를 통해 서버에 직접 접근해보았다. 

 

 

curl 'url서버입력'

 

 

솔직히 먼 말인진 모르겠어서 다시 해보았다..

 

 

음..솔직히 먼 말인진 모르겠지만

{ } 형태로 쭈루룩 나오는 걸 보니 서버와는 이상이 없다는 걸 알 수 있었다. 

 

그럼 대체 머 가 문 제 야

 

 

3. LocalHost 를 자신의 IP 주소로 바꾸기 

이건 사실 expo 로 어플을 만들거나 ...서버 url 이 localhost:3000 으로 되어있는 사람들은 애뮬레이터나 시뮬레이터가 잘 작동하지 않을 수 있다고 한다. 

그럴 때는 

 

여기 시스템설정에 들어가면 자신의 IP 주소가 나와있는데 그걸 복붙해서 localhost 대신에 그 ip 주소를 복붙하면 된다고 한다.

하지만 나는 ...백엔드 분들이 열심히 만들어주신 삐까뻔쩍한 url 이었기 때문에 이 방법은 실패 ㅜ 0 ㅜ

 

📌 4. 완전 해 결 !!!!! - xcode 에서 Info.plist 수정하기

사실 이 방법을 작성하기 위해 포스팅을 한거라고 해도 과언이 아니다  ... ㅎㅎ

(1) 프로젝트에서 xcode 실행하기

(2) info.plist 들어가면 

 

이런 식으로 나와있다.

여기서 Information Property List 에 + 버튼을 눌러서

App Transport Security Settings 를 추가해준다.

 

( 나는 이미 있었는데..그냥 기존에 있던거 지우고 다시 추가해줌) 

 

아무튼 그렇게 하고 여기서 중요!!!! App Transport Security Settings 안에!!!다가 (+) 를 눌러줘야함

안그러면 Allow Arbitary Loads 가 안보일것임 ㅜ

아무튼 안에다가 넣어주고 value -> YES 를 해준다.

 

정리하자면~~~~

• xcode 실행
• 프로젝트의 info.plist 에 들어감
• information property list 항목에서 (+) 누르고 app transport security settings 추가
• app transport security settings 안!!!에 (+) 누르고 allow arbitary loads 추가
• allow arbitary loads value 값 YES 로 설정
• xcode 상단에 product-> clean build folder 를 눌러 재설정한거 저장해줌
• 다시 vscode로 돌아와서 앱 재실행
• 서버 작동 ㅎㅎ

 

 

사실 이렇게 하면 모든 http 를 허용해주는거라 조금 문제가 있다고는 하는데...

일단 그부분은 나중에 더 추가하겠음 ㅎㅎ