아이폰에서 localhost 접근하기

 ・ 1 min

photo by Mathias Reding on Unsplash

플러터로 프로토타입용 앱이 아이폰으로는 잘 동작해서 크롬으로 띄워서 맥에서 테스트해 봤을 때도 잘 되어서 시험 배포를 해봤어요. 그런데 배포 이후 아이폰으로 접근한 뒤, 테스트해 봤을 때 기능이 안 되는 경우가 생겨서 아이폰으로 사파리를 들어가 보고 테스트하자고 생각했어요.

그런데 같은 WI-FI로 연결되어 있지만 어떤 URL로 들어갈 수 있을지 방법을 찾아봤어요.

먼저 개발 환경을 실행한 컴퓨터의 IP 주소를 알아야 해요. IP를 확인할 방법은 많아요.

IP 확인하기#

맥 사용자 기준으로 설명해 드릴게요. 상단에 와이파이 아이콘이 있다면 Option 키를 누르고 와이파이 아이콘을 선택해주세요.

그러면 기존과는 다르게 이런 식으로 표시되는데 연결된 와이파이 부근에서 할당된 내 IP를 확인할 수 있어요.
image

시스템 설정 -> Wi-Fi -> 연결된 Wi-Fi 세부사항 버튼 클릭으로도 IP 주소를 확인할 수 있어요.
image
터미널을 통해 확인하려면 ifconfig | grep inet을 쳐주세요. 그러면 6번째에서 netmask라는 텍스트 앞에서 IP를 확인하실 수 있어요.

image

아이폰에서 접속하기#

저는 VS Code에서 플러터를 기본 설정대로 chrome으로 잡고 접속하면 연결이 안 되었어요.
대신 flutter run -d chrome --web-hostname=0.0.0.0 --web-port=8080로 실행하고 크롬이 뜨면 주소창에서 IP 주소를 바꾼 뒤, 복사해 주세요.

image

아이폰에서 원하는 브라우저를 선택하고 주소창에서 붙여넣기 및 이동을 누르고 조금 기다리면 연결이 될 거예요! 그럼 아래처럼 아이폰 사파리로 접속한 모습을 볼 수 있어요.

|400


In peace, sons bury their fathers. In war, fathers bury their sons.

— Herodotus


Other posts
cover_image
 ・ 8 min

Flutter 렌더링 오류 살펴보기

cover_image
 ・ 4 min

VS Code에서 쓰기 좋은 확장자 추천

cover_image
 ・ 15 min

Flutter로 Feature-First 아키텍처 예제 소개