❗로컬에 XAMPP 설치
https://www.apachefriends.org/

 

XAMPP Installers and Downloads for Apache Friends

What is XAMPP? XAMPP is the most popular PHP development environment XAMPP is a completely free, easy to install Apache distribution containing MariaDB, PHP, and Perl. The XAMPP open source package has been set up to be incredibly easy to install and to us

www.apachefriends.org

자신의 컴퓨터와 맞는 운영체제 선택
자동으로 다운로드됨

 

기본 설정 그대로 next
경로는 변경해도 상관없지만 저는 기본경로로 하겠습니다
액세스 허용 클릭

 

XAMPP가 실행된 모습으로 MySQL은 이미 설치되어 있어서 포트 번호가 겹친다는 오류 문구가 뜬다
아파치의 start 버튼을 누르면 초록불이 들어오며 실행되는 모습을 볼 수 있다

 
 
 
❗포트포워딩을 통해 외부(4G, 5G 등)에서 접속
✏️localhost로 접속하기

localhost로 접속하면 XAMPP를 통해 실행 중이라 이런 창이 뜸
다른 페이지를 보여주기 위해 html파일을 새로 생성
파일 이름으로 접근하면 만든 페이지가 보임

 


✏️같은 공유기를 사용하는 다른 기기로 내 컴퓨터 웹서버 접속(127.0.0.1이 아닌 내 컴퓨터의 IP주소로 들어가기)

cmd에 ipconfig 명령어를 입력하면 나오는 창
IPv4 주소로 컴퓨터에서 접근한 모습

 

IPv4 주소로 핸드폰으로 접근한 모습

 

✏️공인 IP 검색하기

공유기 내에서의 IP(내부 IP, 사설 IP)는 192.168.45.36이었지만 공인 IP(외부 IP)는 110.xxx..이다
외부에서 내 컴퓨터의 웹서버로 들어오기 위해서는 외부 IP가 내부 IP로 바뀌어야 한다
그래서 포트 번호를 사용해서 외부 IP를 내부 IP와 연결시켜야 하고 이 방법이 포트포워딩이다

 
✏️Port Forwarding

주소창에 cmd에 있는 게이트웨이 주소를 입력해서 들어온다
로그인 후 포트포워드 창으로 들어옴
포트포워딩 설정

 

컴퓨터에 yujin.html이 제대로 불러와졌다!
폰에서도 yujin.html도 제대로 불러와졌다!

 
 

728x90
반응형

'🔻Extracurricular Activity > UMC' 카테고리의 다른 글

[UMC 4기] server 2주차-2  (0) 2023.04.03
[UMC 4기] server 2주차-1  (0) 2023.04.03
[UMC 4기] server 1주차-1  (0) 2023.03.29
[UMC 3기] 3rd UMC 회고  (0) 2023.02.16
[UMC 3기] 3rd UMC DemoDay 후기  (0) 2023.02.16
_니지