03-6 · 가린 비밀번호가 전송할 때도 가려질까?

내 로그인 관찰 실습실 · 03 실습 ZIP

HTTP 요청·응답을 관찰한 뒤 진행하는 짧은 실험입니다. 이번에는 공개된 가짜 계정으로만 로그인 모양을 흉내 냅니다. 회원가입·DB·로그인 유지 기능은 없습니다.

오늘 하나만

비밀번호 입력란의 ●●●, POST 요청, 통신 암호화는 서로 다르다.

1. 먼저 예상하기

화면에서는 비밀번호가 ●●●로 보입니다. 로그인 뒤 주소창에도 비밀번호가 없습니다. 통신 내용을 관찰하는 사람에게도 보이지 않을까요?

예상을 한 문장으로 적고, 실험 뒤 고쳐 봅시다.

2. 공개 가짜 계정으로 보내기

공통 실습: 교사가 서버와 Wireshark를 준비합니다. 학생은 서버를 켜지 않고 **교사가 안내한 http://교사IP:8083**에 접속합니다. 127.0.0.1은 교사가 아닌 자신의 컴퓨터를 가리킵니다.

1. Demo user에서 자기 실습 번호 demo01~demo05를 선택합니다.
2. 비밀번호는 공개값 class-demo-123이 미리 입력되어 있습니다. 직접 바꾸거나 실제 비밀번호를 입력하지 않습니다.
3. Send demo login을 한 번 누릅니다.
4. Demo accepted를 확인합니다. 이것은 입력한 가짜 값을 비교한 결과이며, 로그인 상태를 기억하지 않습니다.

3. 내가 보낸 POST 찾기

교사 화면을 함께 봅니다. 학생마다 Wireshark를 설치하거나 캡처할 필요는 없습니다.

1. 교사가 캡처를 시작하면 번호 순서대로 자기 로그인을 한 번 더 보냅니다.
2. 교사가 표시 필터 tcp.port == 8083으로 요청을 고르고 Follow → TCP Stream을 엽니다.
3. 교사 화면의 POST /login 헤더 다음 빈 줄 아래에서 자신이 보낸 demo 번호와 공개 비밀번호를 찾습니다.
4. 자기 번호·요청 경로·찾은 본문과 함께 “교사 캡처 화면에서 관찰”이라고 기록합니다.

POST /login HTTP/1.1
...
Content-Type: application/x-www-form-urlencoded
...

username=demo01&password=class-demo-123

위 예시는 일부 헤더를 생략했습니다. 페이지 HTML에도 공개 비밀번호가 있으므로, 검색 결과 하나만 보고 끝내지 말고 POST 요청 본문인지 확인합니다. http.request가 안 보이면 TCP Stream으로 읽거나 교사와 Decode As → HTTP를 확인합니다.

현장 캡처를 열 수 없을 때

03 실습 ZIP 안 captures/README.md의 **TCP 전송 바이트 관찰 예시 (패킷 캡처 아님)**를 함께 읽습니다. captures/01-http-client-stream.txt의 관찰 구간에서 POST 본문을 찾고, 02-https-client-stream.txt의 TLS 바이트 구간과 비교합니다. HTTPS 파일의 설명에 적힌 공개값을 관찰 결과와 혼동하지 않습니다.

이 자료는 준비된 가짜 요청을 기록한 예시이며 내 요청이나 Wireshark 캡처가 아닙니다. IP·TCP 헤더와 패킷 수는 확인할 수 없습니다. 사용했다면 **“제공된 TCP 바이트 예시에서 관찰”**이라고 기록합니다.

4. 코드 한 부분 읽기

파일은 09-http-login/server.mjs입니다.

let body = '';
request.setEncoding('utf8');
request.on('data', (chunk) => { body += chunk; });
request.on('end', () => {
  const fields = new URLSearchParams(body);
  // 완성된 요청 본문에서 가짜 계정과 비밀번호를 비교한다.
});

본문은 조각으로 들어올 수 있어 end까지 모은 뒤 읽습니다. data 한 번이 요청 본문 전체라는 뜻이 아닙니다. 이 서버의 HTTP 형식 처리는 Node의 http 모듈이 담당합니다.

선택 변경: 자기 컴퓨터의 실험 서버에서만 폼의 value="class-demo-123"을 value="wrong-demo"로 바꿉니다. 공동 관찰 뒤 자기 서버를 켜고 브라우저를 http://127.0.0.1:8083으로 옮겨 진행합니다. 저장 후 서버를 다시 실행하고 새로고침하면 전송 본문과 결과가 어떻게 바뀔지 예상해 봅니다. 서버의 비교 기준은 그대로 두고, 관찰 뒤 바꾼 값을 복원합니다.

5. 자기 말로 정리하기

• ●●●는 화면에서 무엇을 가리는가?
• POST 본문이 주소창에 안 보이는 것과 암호화는 어떻게 다른가?
• 같은 네트워크라면 모든 친구의 통신이 자동으로 보이는가?

성공 기준: **“이 HTTP 요청은 본문을 암호화하지 않아, 통신을 볼 수 있는 위치에서는 입력값을 읽을 수 있다”**라고 교사 화면에서 찾은 자기 요청 또는 자신의 캡처와 연결해 설명합니다. 현장 관찰이 막혔다면 제공 예시로 설명하되 관찰 출처를 구분합니다. 개인 캡처 파일은 필수 제출물이 아닙니다.

다음 04 HTTPS 실습에서는 같은 가짜 값을 전송하면서, 중간에서 보이는 내용만 어떻게 달라지는지 비교합니다.