반응형 0. 이론16 [이론] CRSF 공격 예제 1. CRSF란?CSRF(Cross-Site Request Forgery, 사이트 간 요청 위조)란 사용자가 인증된 권한의 데이터를 가지고 있는 상태에서 악의적인 웹사이트를 방문하면,공격자가 사용자의 권한을 도용하여 서버에 원치 않는 요청을 보내는 공격이다. 2. CRSF 공격 사이트 실습 사이트 생성2-1. bank사이트 생성mkdir csrf_bankcd csrf_banknpm init -ynpm install express cookie-parser body-parser 먼저 bank 사이트를 만든다. 이 bank는 농협, 옥션, 네이버 등 사용자가 회원가입을 하고 계좌에 대한 정보를 입력하는 유명한 플랫폼이 될 것이다. bank.js 생성const express = require('express').. 0. 이론 2025. 3. 16. [이론] 파일에서 Container와 Codec 관계 1. Container란?컨테이너는 단순히 파일을 저장하는 형식으로, 즉 코덱을 담는 그릇이다. 특정 컨테이너에는 지원하는 코덱이 정해져 있다. 예를 들어 찜기는 만두를 찌기 위한 전용 그릇이다.용도에 맞지 않게 밥을 올려 찔 수도 있다.그러나 액체류는 흘러버리기 때문에 찔 수가 없다. 이와 같은 이유로 MP4(.mp4)는 국제 표준 컨테이너이지만 스트리밍과 압축 효율을 고려해 설계되었고, 특정 코덱만 안정적으로 재생할 수 있도록 제한되어있다. 다양한 코덱을 지원하지만 H.264, H.265(HEVC), AAC 같은 특정 코덱만 포함 가능하다.MP3 같은 오래된 코덱이나 VP9, AV1 같은 특정 코덱은 MP4에 넣을 수 없다. 2. Codec이란?오디오/비디오 데이터를 압축하고 해석하는 기술이다.파.. 0. 이론 2025. 3. 12. [이론] 디지털 오디오 (Samplate & Bit depth) 1. 디지털 오디오 파일디지털 오디오 파일은 아날로그 사운드의 파형의 근사값을 구하여 저장하는 방식이다. 이 디지털 오디오 파일은 Samplate와 Bit depth에 의해 품질이 결정된다. 막대를 무한히 촘촘히 쌓으면 그래프의 넓이를 구할 수 있는 적분과 비슷한 개념으로 보아도 된다. 2. SimplateSamplate는 샘플의 속도로 위 그래프로 보았을 때 x축을 담당한다. 1초에 몇개의 막대가 있는지 정하는 것이다.보통 디지털은 44.1kHz인데, 1초에 44100의 막대가 있다고 생각하면 된다. 3. Bit depthBit depth는 비트의 심도로 위 그래프로 보았을 때 y축을 담당한다. Simplate를 얼마나 정확하게 표현할 수 있냐이다.음량도 큰 음량, 작은 음량 또는 고주파, 저주파와.. 0. 이론 2025. 3. 12. [이론] 동영상 구조 파악 1 (feat. ftyp) 먼저 샘플 mp4 파일을 업로드. binary viewer로는 Windows라면 HxD, Mac은 다 별로 ...0. Atom Box란?글에 들어가기에 앞서 파일 구조 규칙을 먼저 파악해야하는데, Atom Box라는 것을 간략히 소개한다. Atom Box는 MP4 파일을 구성하는 기본적인 데이터 블록이다. 각각의 Box는 항상 크기 4byte 와 유형(type) 4byte 정보를 포함하며, 크기 - 8byte는 모두 데이터 영역이다.트리(Tree) 구조로 되어 있어 특정 정보를 쉽게 찾을 수 있다. 1. ftyp 란? - file type의 약자로 파일 형식을 나타내는 데이터 1-1. 실제 데이터 1-2. 구조OffsetHEXASCII (값)의미0x000000001C(28)ftyp Box 크기0x046.. 0. 이론 2025. 2. 28. [이론] 동영상 구조 파악 0 (feat. mp4) 이번에 MP4에 대해서 공부를 하는데 정리겸 올린다. 동영상 파일을 저장할 때,1. 이것은 동영상 파일이라 선언하고 (ftyp)2. 데이터를 받는 족족 쌓는데 (mdat), 이 데이터가 어느 위치에 존재하는지 메모리로 기억하고3. 데이터가 중단되면 메모리에서 꺼내와 메타데이터를 작성한다 (moov) moov같은 경우는 mdat 앞에 존재할 수도 있다. 메타데이터를 빨리 읽어야하는 경우가 있을 수도 있으니 상황에 따라 앞에 위치하는 것도 좋다. 이것은 샘플파일 곧 노가다 시작한다.1. ftyp (File Type Box)ftyp : 파일 형식 및 호환성 정보 2. mdat (Media Data Box)mdat : 실제 미디어(비디오, 오디오) 데이터 저장 3. moov (Movie Box)moov : 전체.. 0. 이론 2025. 2. 19. NodeJS Event Loop 동작 원리 (feat. process.nextTick) 먼저, 이 이론을 왜 알아야 하는가에 대한 소스코드를 먼저 설명한다. 아래의 소스코드에서 "test start !", "1s END!", "test end!"의 출력 순서와 시간은 어떻게 될까? ("test start!"의 시간은 0초, for문은 약 3초가 걸린다고 가정한다) console.log("test start! ", new Date().toString()); setTimeout(function() { console.log("1s END! ", new Date().toString()); }, 1000); for(var i = 0; i < 5000000000; i++) { } console.log("test end! ", new Date().toString()); "test start !"(0초).. 0. 이론 2024. 3. 30. UI 디자이너 UX 디자이너 차이점 보통 구인구직에서 UI/UX Designer를 구하는 공고가 많이 보이긴 한데, UI에 대해서는 User Interface의 뜻을 잘 알고 있지만, UX는 모르는 사람이 꽤 있다. UI와 UX가 항상 따라붙어서 비슷한 개념이라고 생각하는 사람이 있지만, 어느 한편에는 비슷하면서도 어느 한편으로는 다르다. UI(User Interface)와 UX(User Experience)의 차이점에 대해서, 아주 짧게 느낌적으로 비교를 해보자. 정의 UI(User Interface) 사용자가 바라보는 인터페이스로 크기, 소리, 빛 등의 제품의 외양적인 디자인을 뜻한다. 즉 사용자에게 "세련되어 보인다", "~풍의 디자인이다", "매력적이다"라는 느낌을 주는 디자인이다. UX(User Experience) 사용자의 경험.. 0. 이론 2024. 3. 18. DNS란?(DNS 구성) DNS 구성에 대해 설명을 할 것인데, 공식문서가 아닌 내가 알고 있는 지식(+ 들은 얘기, 블로그 참조)을 적은 내용으로 틀린 정보가 있을 수도 있다. (피드백 주시면 감사감사...) 1. DNS란? DNS(Domain Name System)란 외우기 쉬운 text형태의 Host Domain Name을 외우기 힘든 숫자형태의 IP주소를 text로 변환해 주는 시스템이다. 좀 더 자세히 설명하자면 네이버를 접속하기 위해 주소창에 "223.130.195.200"을 입력해야한다. (글 쓴 기준 IP) 이 숫자는 의미가 없기 때문에 외우기가 힘드며 다음, 유튜브, 티스토리 등 외워야 할 사이트가 많으면 헷갈리기 일쑤이다. 외우기 쉽게 알파벳, "www.naver.com"이라는 텍스트로 입력하면 "223.130.. 0. 이론 2024. 1. 27. Throttle vs Debounce 진짜 간랸하게 요약해서 설명하자면 Throttel과 Debounce의 공통점은 잦은 요청에 의해 퍼포먼스가 떨어질 때 해결방안이라고 할 수 있다. 처음에는 DMA와 비슷하다 생각했지만 엄연히 다르고... 느낌은? 비슷하다 할 수 있다. 예를 들어보자. 임의의 인터럽트가 0.01초마다 요청된다고 생각해보자(우선순위는 최상위). 그러면 우선순위에 의해 0.01초마다 수행이 될텐데, 그동안 다른 것은 수행하지 못한다. 즉 비효율적이다. 좀 더 자세하게 예를 들어보자. javascript에서 resize 이벤트 요청을 구현했다고 했을 때, 커서를 잡고 브라우저를 resize할 때 무수히 많은 요청이 일어난다. 1에서 100까지 크기를 resize할떄 100번의 이벤트가 일어날 것인데, 과연 유저는 1에서 100.. 0. 이론 2023. 1. 28. Blocking & Non-blocking I/O + Synchronous&Asynchronous I/O 차이점 유튜브 널널한 개발자 TV를 보다가 어떠한 댓글에 Non-blocking과 Asynchronous가 다르다는 댓글에 구글링을 좀 했다. Blocking&Synchronous와 Non-blocking / Asynchonous의 차이점을 크게 보면 이해가 빠른데 자세히 보니 헷갈리더라. 두리뭉실하게 같다고 보는 블로그가 있고 개념이 비슷한데 엄연히 다르다는 블로그도 있고 비동기와 논블록만 다르다는 글도 있고... 일단 내가 맞다고 생각하는 것들로 써본다... 편의상 I/O는 생략한다. Blocking & Synchronous 공통점은 request 후 대기한다는 것 차이점은 제어권이 누구에게 있느냐. Blocking은 request를 하게 되면(예를 들면 File I/O) Kernel에 요청을 하고 제어권을.. 0. 이론 2023. 1. 10. TCP 송/수신 원리 Client에서 요청을 받으면 데이터를 파일 시스템을 통하여 MemoryBuffer로 읽어옴 이때 메모리 버퍼 크기는 개발자가 정할 수 있다. Memory Buffer에 담긴 데이터를 TCP Buffer로 복사한다. (Buffered I/O) Memory Buffer는 보통 64KB이다. (Window Size 개념이 있는데 송신 측도 관련 있는진 모르겠다.) TCP Buffer에 담긴 데이터를 Segment화한다.(더 잘게 쪼갠다) 이때 데이터 순서를 의미하는 id번호를 부여한다. = Packet L2로 내려가게 되면서 Frame화 된다. Frame을 전송하게 되면 같은 프레임으로 온다는 보장은 없다. 택배도 판매점 - 서울 전달하는 택배기사님이 있고, 서울-부산, 부산-구매자 집으로 전달하는 택배기사.. 0. 이론 2023. 1. 8. 모드버스란? (+ 프레임 구성, 예제, 샘플) 1. 모드버스란? Modbus는 원래 Modicon(현재 Schneider Electric )에서 PLC( Programming Logic Controller )와 함께 사용하기 위해 1979년에 발행한 데이터 통신 프로토콜이다. 모든 프로토콜이 만들어진 이유가 그렇듯 모드버스 또한 PLC 통신규약이 모두 달랐기에 편리성을 위해 통일시키고자 생겨났다. 처음에는 시리얼통신(RS-232, RS-485)을 기준으로 만들어졌으며 현재는 TCP, UDP에서도 구현할 수 있도록 확장되었다. 마스터/슬래이브 구조로 여러 주변 장비의 상태 정보를 모니터링할 수 있다. 네트워크 상에 연결된 모든 장비들이 요청을 받으나, 정해진 장비만 답을 하는 구조이다. RTU(Remote Terminal Unit), ASCII, TC.. 0. 이론 2022. 7. 14. 이전 1 2 다음 반응형