코드숨 Real World HTTP 책 스터디를 진행하면서, 문제를 만들고 답변을 기록한 레포입니다.
- HTTP가 통신 고속화를 위해서 어떤 기능들을 지원했나요? 어떻게 가능한가요?
- (1) keep-alive
- 연속된 요청일 때, 접속을 재사용한다.
- (2) 파이프라인
- 파이프라인은 최초의 요청이 완료되기 전에 다음 요청을 보내는 기술로, 다음 요청까지의 대기 시간을 없앰으로써, 네트워크 가동률을 높이고 성능을 향상시킨다.
- TLS계층 통신에서 대칭키암호화와 비대칭키 암호화가 어떻게 사용이되나요?
- TLS에서 통신마다 한번씩 사용되는 것은 비대칭키 암호화를 사용하고 그 이후에는 대칭키 암호화로 고속화로 신속하게 주고받는다.
- 대칭키 암호화는 TLS에서 일반 통신의 암호화에 사용된다.
- 반면, 비대칭키 암호화는 TLS에서 디지털 서명에 사용된다.
- TLS 통신 절차를 설명해주세요.
- TLS 통신 절차에는 크게 3단계가 있습니다.
- 처음에는 핸드셰이크 프로토콜로 통신을 확립하는 단계이고
- 그 다음은 레코드 프로토콜로 불리는 통신 단계이고,
- 마지막은 SessionTicket 구조를 이용한 재접속 시의 고속 핸드 셰이크 단계 입니다.
- HTTP/1.1에서 host가 생긴이유는?
- 하나의 웹 서버로 여러 웹 서비스를 운영하기 위해서
- Chunk 전송방식은 주로 어디서 사용되는가?
- 라이브 동영상을 배포할 때 사용되고, 시간이 걸리는 검색 결과를 전송할 떄 사용됩니다.
- 브라우저가 다운로드 하려면 어떤 헤더 속성이 있어야 하는가?
Content-disposition헤더가 포함되어 있고, 헤더 내용에attachment가 있으면 브라우저는 파일을 저장한다.- 헤더 내용에
filename이 있으면 저장할 때 기본적으로 이 이름을 사용한다. - 헤더 내용에
inline이 있으면 저장하지 않는다.
- XMLHttpRequest와 브라우저의 HTTP 요청 차이는 무엇인가?
- 송수신할 때 화면이 새로고침 되지 않는다.
- GET과 POST 이외의 메서드도 전송할 수 있다.
- 폼의 경우 키와 값이 일대일이 되는 형식의 데이터만 전송할 수 있고, 응답은 브라우저로 표시되지만,XMLHttpRequest는 다양한 형식을 송수신할 수 있다.
- XMLHttpRequest는 추가적인 보안상의 제약이 있다.
- 정보 제한
- 쿠키에 httpOnly속성이 있으면, 스크립트에서 쿠키를 읽을 수 없다.
- 전송 제한
- 메서드, 헤더, 도메인을 제한한다.
- same-origin-policy 기본적으로 브라우저가 액세스하고 있는 호스트에만 접근할 수 있다.
- CORS로 다른 출처의 리소스도 접근할 수 있다.
- 메서드를 제한한다.
- 브라우저의 능력을 넘을 수 없는 것들은 제한한다. 예를들어
SEC-혹은Proxy-로 시작하는 것들이다.
- 정보 제한
- 롤 폴링 방식으로 서버에서 클라이언트로 자유로운 타이밍으로 메세지를 전송할 수 있다. 이런것을 reverse-ajax라고 부른다.
- 인증과 인가의 차이는?
- 인증
- 누구인지 확인하는 것.
- 인가
- 권한을 갖고 있는지 확인하는 것
- 오픈아이디 커넥트가 앞으로 사실상의 표준이 될 것이라고 한 이유는?
- 인증과 인가에 모두 사용할 수 있고, 서비스 제공자에서 구현하기도 어렵지 않기 때문입니다.
- 원격 프로시저 호출은 무엇인가요?
- 다른 컴퓨터에 있는 기능을 마치 자신의 컴퓨터 안에 있는 것처럼 호출하고, 필요에 따라 반환값을 받는 것.
- HTTP/2에서 HTTP/1.1으로부터 무엇이 제일 달라졌는가?
- HTTP2는 프레임 단위로 통신을 하는데, 데이터를 프레임단위로 쉽게 분할할 수 있게 되어 병렬 통신이 가능하게 되었다.
- Fetch API의 특징은 무엇인가? (261p)
- 캐시제어, redirect 제어가 가능하다
- service worker 에서 사용할 수 있다
- TCP state machine과 HTTP/2 state machine의 차이점은?
- (HTTP/2) idle 상태에서 요청을 받음
- (TCP) 요청이 오면 listen 을 함
- WebRTC는 휘발성에 있는 예시로만 소개 되는데, 다른 프로토콜에 비해 선택하는 이유는?
- 브라우저-서버 의 통신 뿐만 아니라, 브라우저간의 통신인 P2P 통신이 가능하기 때문
- HTTP 웹 푸시는 오프라인 상태에서도 사용자에게 알림을 보낼 수 있는 통신을 할 수 있는가?
- service worker 에 핸들러를 등록을 해서 필요할 때에 실행이 된다.
[ B팀 질문]
- [반응형 디자인]
- 반응형 디자인이 무엇이고, 반응형 디자인을 실현할 수 있게 된 요인은 무엇인가요? A. 반응형 디자인은 화면 크기에 맞게 콘텐츠를 표시하는 방법입니다. 단순히 화면 크기를 보는 게 아니라 고해상도 스마트폰에 맞는 이미지 배포 등도 가능합니다. 각각의 기기의 폭 넓이가 다른식으로 구성되있기에 반응형을 실현하게 되었씁니다.
- device 크기에 따라 이미지 크기를 다르게 해야하는 이유는? A. 기기마다 픽셀비율이 다르기떄문에 각각의 화면에 맞춰 고해상도 이미지를 출력해줍니다.
- [시맨틱 웹] '의미를 다룬다'라는 것이 어떤 의미이고, 시맨팁웹의 트리플 개념이란 무엇인가요? A. 표면적인 텍스트 문서가 아니라 의미를 다룰 수 있게 해서 웹의 가능을 더욱 넓히고자 하는 운동입니다. 사람이 페이지에 포함된 정보 텍스트를 읽고 수동적으로 분석해야되는 작업을 브라우저에서 분석해서 정보를 집약한다.
- 트리플의 구성요소
- 주어
- 술어
- 목적어
- 위의 3가지의 서로의 관계성을 통해 웹페이지에서 보여주는 콘텐츠의 의미를 기술 합니다.
- 오픈그래프 프로토콜을 어떻게 활용할 수 있을까? (예제 만들어보기) 코드숨
<head>
<meta property="og:title" content="코드숨">
<meta property="og:url" content="https://www.codesoom.com/">
<meta property="og:image" content="https://codesoom.com/favicon.png">
<meta property="og:description" content="TDD 극악 훈련소">
<meta property="og:locale" content="KR">
<meta property="og:locale:alternate" content="EN">
</head>- AMP 가 어떤 방식으로 속도를 높이는가?
- 크롤러 또는 스파이더가 AMP 페이지가 있는 것을 인식하면(전용태그를 이식하면), 모든 내용을 구굴의 배포 전용 고속 캐시 서버(CDN: 콘텐츠 전송 네트워크)에 복사.
- 페이지 구성을 고정화함으로써 페이지 로딩의 고속화를 달성
- 페이지 구성이 고정화되므로 CDN 지원이 쉬어졌다.
- 콘텐츠를 CDN 쪾에 업로드함으로써 자바스크립트 파일을 캐시에 올리기 쉬워졌다
- 콘텐츠를 서버 쪽에 업로드할 때 태그를 수정해 고속화가 이루어졌다. ※각각의 기능들은 개별 기술이지만 서로 연동하여 작동합니다.
- HLS 의 장점과 단점
- 장점
- 전세계 라우터가 지원하는 HTTP를 사용 할 수 있다.
- 일반 웹서버와 동일한 서버 및 CDN을 사용 할 수 있다.
- 단점
- 청크별로 다운로드가 끝나지 앟으면, 재생이 시작되지 않으므로 지연이 발생.
- 지원되지 않는 환경(브라우저)이 많다.
- 콘텐츠 보호 DRM(Digital Rights Management)에 제약이 있다.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent