⯌ 기본 세팅
⟡ Vmware 세팅
먼저, 가상머신 중 하나인 VMware를 설치합니다.
노말틱님께서 제공해 주신 SegFault_WEBdev.ova 파일을 다운로드하여 VMware에 불러오겠습니다.
File - Open에 들어가 줍니다.
다운로드한 폴더에 위치한 SegFault_WEBdev.ova파일을 선택 후 열어줍니다.
실행버튼을 눌러주면 가상 머신의 전원이 켜집니다.
⟡ Termius 세팅
편의를 위해 Termius라는 프로그램을 사용하겠습니다.
Termius : 안전하게 원격 접속이 가능한 멀티 플랫폼 SSH 클라이언트
로그인을 한 후 원격 접속에 필요한 IP주소를 알기 위해 ifconfig 명령어를 입력해 확인합니다.
원격 접속을 위해 Termius를 실행합니다.
- NEW HOST 선택
- ADDRESS 주소 입력
- SSH 포트번호 22 입력
- 가상머신의 로그인 아이디와 비밀번호 입력
- Connect 클릭
Connect를 누르면 위와 같은 화면을 통해 연결된 것을 확인할 수 있습니다.
한 번 연결해 두면 Hosts에 저장되어 추후에 재접속할 때도 빠르게 연결이 가능합니다.
SFTP를 이용하여 자신의 컴퓨터에 있는 파일을 원하는 Host로 편하고 안전하게 복사 & 붙여 넣기가 가능합니다.
※ SFTP
- 파일을 안전하게 전송하기 위한 네트워크 프로토콜
- SSH를 기반으로 암호화되어 데이터가 안전하게 보호
기본 세팅은 여기서 마치고 이어서 웹 서버에 대해 살펴보겠습니다.
⯌ 웹 서버 이해
※ 웹 서버
- 클라이언트의 요청 처리.
- 정적인 콘텐츠를 제공.
- 동적인 요청을 WAS(웹 애플리케이션 서버)로 전달한 후, 그 결과를 클라이언트에게 반환.
※ WAS(Web Application Server)
- 동적 페이지를 처리해 주는 서버.
- 코드를 실행해서 결과물을 웹 서버에게 반환.
※ DNS 서버
- 도메인을 IP 주소로 변환.
- 변환된 IP주소를 바탕으로 Web서버에게 정보 요청.
※ URL
- 인터넷상에서 특정 파일의 위치를 나타내는 주소.
- 클라이언트가 URL을 통해 서버로 요청을 보내면 서버는 해당 요청을 처리.
※ URL 구조
- [Protocol]://[Domain or IP Adress]:[Port]/[File Path]
- 예시 : http://192.168.116.131:80/normaltic_pic.jpeg
※ 프로토콜
- 네트워크 또는 시스템 간 데이터 통신을 가능하게 하는 규칙
※ 포트 번호
- 데이터가 컴퓨터 내에서 어떤 서비스로 전달될지를 결정하는 역할
- 예시) HTTP : 80, HTTPS : 443, DNS : 53, SSH : 22 등
/home/student/webBasic 경로에서 웹 서버를 실행하였습니다.
경로에 있는 test.txt파일을 요청해 보겠습니다.
이처럼 URL에서 파일 경로는 웹 서버를 실행한 위치가 기준이 됩니다.
하위에 위치한 파일들은 요청이 가능하지만 상위 디렉터리로의 접근이 불가능합니다.
포트번호는 생략 가능합니다.
포트번호를 생략하면 프로토콜의 잘 알려진 포트(Well-Known Port)에 해당하는 값이 자동으로 인식됩니다.
하지만 꼭 잘 알려진 포트번호만을 사용해야 하는 것은 아니기에 다른 포트번호로도 지정 가능.
파일 경로도 생략이 가능합니다.
https://www.naver.com/ 라고 입력하면 자동으로 브라우저는 https://www.naver.com/index.html로 요청됩니다.
디폴트 페이지 : URL에 파일을 명시하지 않아도 웹 서버가 자동으로 기본 페이지를 제공.
※ 잘 알려진 포트 (Well-Known Port)
- 0번 ~ 1023번 포트
- HTTP, HTTPS, DNS, SSH 등과 같이 잘 알려진 포트
프런트엔드(Front-End)
- 클라이언트 측 코드 (브라우저가 실행하는 코드)
- 예) HTML, CSS JavaScript
백엔드(Back-End)
- 서버 측 코드
- 예) PHP, ASP, JSP
⯌ 동적 페이지(Dynamic Page)
※ 동적 페이지(Dynamic Page) :
사용자의 요청에 따라 실시간으로 변경되는 웹 페이지.
클라이언트가 동적 페이지를 요청하면 WAS가 처리해 준 뒤 웹 서버로 반환해 줍니다.
클라이언트 → 웹 서버 → WAS → 웹 서버 → 클라이언트
제공받은 가상머신에 있는 dockerCMD(웹 개발환경을 만드는 스크립트)를 실행시켜 웹 환경을 만들어주겠습니다.
sudo docker ps -a 명령어를 통해 실행 중인 컨테이너가 있는지 확인합니다.
만약 실행 중인 컨테이너가 있다면 sudo docker rm -f [CONTAINER ID]를 입력하여 삭제해 줍니다.
스크립트 내용을 확인해 보면 LAMP(Linux & Apache & MySQL & PHP)를 실행시킨다는 것을 알 수 있습니다.
dockerCMD를 실행시켜 줍니다.
정상적으로 실행된 모습을 확인할 수 있습니다.
이제부터 포트번호가 80번이 아닌 1018번으로 접속 가능합니다.
⟡ PHP 실습
< 1 > echo $_GET['id']
<form method="GET">
<input type="text" name="id"/>
</form>
<?php
echo $_GET['id'];
?>name.php (1)
echo : 출력하는 명령어
$_GET['id'] : GET Method로 전달받은 파라미터
파라미터 : 사용자가 웹 서버에게 전달하는 데이터
GET 메소드를 활용하여 데이터를 전송하면 url에 id=Normaltic이 표시됩니다.
? : 파라미터 구분자
URL에 ?가 나오면 웹 서버가 파라미터도 같이 WAS에게 보내줘야 한다고 인식합니다.
WAS는 GET 파라미터를 확인하여 처리하고 그 값을 함께 반환합니다.
< 2 > echo $_POST['id']
<form method="POST">
<input type="text" name="id"/>
</form>
<?php
echo $_POST['id'];
?>name.php (2)
하지만 POST 메소드를 활용하여 데이터를 전송하면 URL에 파라미터가 표시되지 않습니다.
파라미터를 보내는 2가지 방식
- GET 메소드 : 파라미터를 URL에 붙여서 전달
- POST 메소드 : URL에 정보를 넣지 않고 Request의 Body부분에 넣고 전달
로그인 페이지에서 아이디와 비밀번호를 웹 서버에게 전달할 때 GET 메소드는 URL에 정보가 드러나기 때문에 POST 메소드가 좋습니다.
WAS가 PHP코드를 받으면 그 코드를 실행해서 그 값만을 전달하기 때문에 브라우저에서는 PHP코드 확인이 불가능합니다.
< 3 > 다른 페이지에 파라미터를 전달하는 방식 ( action )
<?php
echo $_GET['id'];
echo $_GET['pw'];
?>login_proc.php
입력할 User ID와 User Password를 출력할 페이지를 만듭니다.
<form method="GET" action="login_proc.php">
<input type="text" name="id" placeholder="User Id"/>
<input type="password" name="pw" placeholder="User Password"/>
<input type="submit" value="login"/>
</form>login.php
form태그의 action 속성을 이용하여 login_proc.php로 전달되게끔 합니다.
login_proc.php가 전달받은 데이터를 출력합니다.
'웹 모의해킹 취업반 스터디 > 수업' 카테고리의 다른 글
| [ 3주차 수업 ] 식별, 인증 & 로그인 로직 & 쿠키, 세션 (0) | 2025.04.23 |
|---|---|
| [ 2주차 수업 ] 데이터베이스와 SQL 쿼리문 & DB 요청 (0) | 2025.04.16 |