React Native Expo - Network response timed out 해결 방법

컴퓨터로 열심히 개발을 하고 폰에 연결해서 보려고 expo start를 쳤는데 연결이 안 된다면?

아래 항목들을 확인해보자!

 

1. PC와 모바일이 같은 네트워크를 사용하고 있는지 확인

PC와 폰이 서로 같은 wifi에 연결되어 있어야 정상 작동한다.

PC에 연결된 wifi의 이름과 폰에 연결된 wifi의 이름이 동일한지 확인해보자!

 

2. 네트워크 설정이 개인 와이파이로 되어 있는지 확인

동일 네트워크에 연결했는데도 안 된다면?

네트워크 설정이 공용으로 되어 있어서 그럴 수 있다.

(윈도우 기준) 컴퓨터에서 wifi 목록 중 사용 중인 wifi의 속성 아이콘을 누르면 이를 설정할 수 있는 창이 뜬다.

여기에 '공용 네트워크(권장)'에 체크가 되어 있다면, '개인 네트워크' 쪽에 체크를 해주자.

그래야 폰에서 내 컴퓨터를 찾을 수 있다!

 

개인 네트워크에 체크!

 

3. Expo를 tunnel로 실행해보기

wifi에 아무런 문제가 없는데도 계속 연결이 안 된다면?

expo를 tunnel로 실행해보자.

기존 expo start 대신 아래 명령어로 앱을 실행한다.

expo start --tunnel

 

*Expo Tunnel이란?

Expo 도큐멘테이션 사이트에 다음과 같이 Tunneling에 대해 설명이 되어 있다. 대충 요약 해석하면 더 개방적인 네트워크 연결 방식인 것 같다.

Restrictive network conditions (common for public Wi-Fi), firewalls (common for Windows users), or Emulator misconfiguration can make it difficult to connect a remote device to your dev server over lan/localhost. Sometimes it's easier to connect to a dev server over a proxy URL that's accessible from any device with internet access, this is referred to as tunneling. npx expo start provides built-in support for tunneling via ngrok. (출처: https://docs.expo.dev/more/expo-cli/)

 

그렇다면 보안 등의 단점은 없을까?

도큐멘테이션에 따르면 터널링은 로컬 연결보다는 느리고, 보안 문제가 있을 수 있지만 어느정도 조치를 해두었다고 한다. 또한 양쪽 기기 모두에 네트워크 연결이 필요하다는 점도 단점으로 언급하고 있다.

Tunneling is slower than local connections because requests must be forwarded to a public URL. Tunnel URLs are public and can be accessed by any device with a network connection. Expo CLI mitigates the risk of exposure by adding entropy to the beginning of the URL. Entropy can be reset by clearing the .expo directory in your project. Tunnels require a network connection on both devices, meaning this feature cannot be used with the --offline flag. (출처: https://docs.expo.dev/more/expo-cli/)

 

 

4. 위 방법 모두 안된다면?

오늘은 날이 아닌가 보다. 다 끄고 나중에 다시 시도해보자!