Dreamhack/Web hacking

Tools:Browser DevTools

해당 포스팅은 https://dreamhack.io/lecture/roadmaps/1?obj=3를 참고하여 작성하였으며 공부 목적으로 작성하였습니다.개발자 도구크롬 브라우저에서 F12를 누를 경우 개발자 도구로 진입할 수 있다. 개발자도구 레이아웃에 대한 구체적인 설명은 다음과 같다.개발자 도구(F12)1️⃣요소 검사(Inspect) 및 디바이스 툴바(Device Toolbar)2️⃣기능을 선택하는 패널로 다음과 같은 기능들을 사용할 수 있다. • Elements: 페이지를 구성하는 HTML 검사 • Console: 자바 스크립트를 실행하고 결과를 확인 • Sources: HTML, CSS, JS 등 페이지를 구성하는 리소스를 확인하고 디버깅 가능 • Network: 서버와 오가는 데이터를 확인 가능 •..

Background:Web Browser🌐

해당 포스팅은 https://dreamhack.io/lecture/roadmaps/1?obj=3를 참고하여 작성하였으며 공부 목적으로 작성하였습니다.웹 브라우저웹 브라우저는 뛰어난 UX(이용자 경험, User eXperience)를 제공하는 소프트웨어 중 하나로 이용자가 웹 브라우저를 사용하여 쉽게 정보 검색, 다운로드와 같은 기능을 이용하지만 실제로 내부에서 어떠한 연산일 일어나는지는 알 수 없다. 사용자가 주소창에 특정 주소을 입력했을 때 웹 브라우저가 하게 되는 기본적인 동작은 다음과 같다.웹 브라우저의 동작 1. 웹 브라우저의 주소창에 입력된 주소를 해석(=URL 분석) 2. 입려고딘 주소에 해당하는 주소 탐색(DNS 요청) 3. HTTP를 통해 대상 주소에 요청 4. 대상 주소의 HTTP 응답 ..

Background:HTTP/ HTTPS

HTTP 메시지HTTP 메시지에는 클라이언트가 전송하는 HTTP 요청, 그리고 서버에서 반환되는 HTTP 응답이 존재한다. 이들은 모두 HTTP 헤드와 바디로 구성된다는 공통점을 지니고 있다. HTTP 헤드HTTP 헤드의 경우 첫 줄은 시작 줄(Start-line), 나머지 줄은 헤더(Header)라고 부른다. HTTP 바디헤드의 끝을 나타내는 줄바꿈된 줄 뒤 모든 줄을 바디라고 말한다. 해당 부분에는 클라이언트나 서버가 전송하려는 데이터가 포함되어 있다.HTTP 메시지(dreamhack) HTTP 요청HTTP 요청은 서버에게 특정 동작을 요구하는 메시지이다.HTTP 요청의 시작 줄은 메소드(Method), 요청 URL(Request-URL), HTTP 버전으로 구성되어 있다. 각각은 띄어쓰기로 구분한다..

Background:Web

해당 포스팅은 https://dreamhack.io/lecture/roadmaps/1?obj=2를 참고하여 작성하였으며 공부 목적으로 작성하였습니다.Web웹이란?인터넷이라는 통신망을 활용하여 구현된 전 지구적 정보 공간, HTTP를 이용하여 정보를 공유하는 서비스이다. 이때, 정보를 제공하는 주체를 웹 서버(Web Server), 정보를 받는 이용자를 웹 클라이언트(Web Client)라고 한다. 웹 리소스웹 리소스 정의웹에 갖춰진 정보 자산을 의미하며 http://dreamhack.io/index.html 주소를 입력할 경우 dreamhack.io에 존재하는 /index.html 경로의 리소스를 가져오라는 의미이다. 또한, 모든 웹 리소스는 URI(Uniform Resource Indicator)로 구..