[React] 아이폰 핫스팟으로 연결된 맥북에서 아이폰으로 localhost를 확인하는 방법

Pakxe·2024년 10월 20일
6

React

목록 보기
8/8
post-thumbnail

최종 수정일: 2024년 10월 20일

■ 들어가며

iOS 업데이트 후(아마 iOS 18으로..) 아이폰 핫스팟으로 연결된 맥북에서 아이폰으로 localhost를 확인할 수 없는 현상이 있었습니다. 그래서 모바일로 보여진 화면을 테스트하기 어려워 당혹스러웠는데요.

혹시 같은 문제를 겪고 계시는 분들이 있을까봐 글을 남겨두려고 합니다.

빠르게 방법을 알고싶으신 분들은 전체 화면 전환 후 이 포스트의 오른쪽에 보이는 title 목록만 읽으셔도 무관합니다.

■ 환경

아이폰으로 킨 핫스팟을 맥북이 연결하고 있는 상태입니다.

■ 1. 맥북의 설정 > Wi-Fi로 들어가 현재 연결된 네트워크의 세부사항... 버튼을 누릅니다.

🔻 맥북의 설정으로 진입합니다.



🔻 왼쪽에 사이드바에서 Wi-Fi 탭으로 진입합니다.



🔻 상단에 뜨는 현재 연결된 네트워크인 핫스팟의 오른쪽의 세부사항...버튼을 누릅니다.



■ 2. 사이드바의 TCP/IP 탭으로 진입합니다.



■ 3. IPv4 구성 -> 수동으로 설정합니다.



■ 4. IP 주소, 서브넷 마스크, 라우터를 재설정합니다.

▌ IP 주소는 172.20.10.n으로 변경합니다.

n는 2~14사이의 값중 하나로 설정합니다. 14를 초과하는 값으로 설정하니 폰에서 접속이 안됩니다.
저는 10으로 했습니다.



▌ 서브넷 마스크는 255.255.255.240으로 변경합니다.

▌ 라우터는 172.20.10.1로 변경합니다.

🔻 모두 제대로 바뀌었다면 아래와 같은 모습입니다.



■ 5. 사용하고 있는 프로젝트에서 개발 서버를 띄웁니다.



■ 6. 모바일 기기로 접속합니다.

잘 보입니다.

🔻 (접속 성공을 보여주는 예시 !)



■ 7. 모바일 확인을 완료했다면 IPv4 구성 -> DHCP 사용으로 돌려놓습니다.

돌려놓지 않으면 다른 네트워크 사용시 제대로 연결이 안되는 문제가 있을 수 있습니다.

끝으로

이 방법으로 고민하시던 문제가 해결되길 바랍니다.

읽어주셔서 감사합니다.

글을 읽으며 이해가 어려웠던 부분이나 질문하고 싶은 내용이 있으시다면 이메일또는 댓글 남겨주시길 바랍니다.

4개의 댓글

comment-user-thumbnail
2024년 10월 21일

핫스팟으로 연결하면 모바일 연결이 안되는 문제가 발생할 수도 있군요😶 나중에 같은 문제가 발생하면 웨디의 포스팅 참고할게요. 꿀팁 감사합니다~!

1개의 답글
comment-user-thumbnail
2024년 11월 19일

선생님!!!!!! 너무고맙습니다!! 영어로 구글링해도 안나오던 정보인데 덕분에 해결이 되었습니다!!

1개의 답글