장고(Django), HTML Form 및 HttpRequest, HttpResponse

본 글은 Holix의 "리액트와 함께 장고 시작하기 Complete" 강의를 듣고 작성한 일지입니다.

HTML Form(클라이언트 측)
- 클라이언트에서 사용자에게 입력폼을 제공하고, 이를 서버로 전송하고자 할 때

Django Form(서버 측)
- 클라이언트로부터 전달받은 값들에 대한 유효성 검사를 수행하고, 이를 데이터베이스에 저장하는 등의 처리
- HTML Form을 생성하는 기능 제공

HTML Form

HTML 웹페이지에서는 <form></form> 태그를 통해 입력폼을 구성하고 submit 시에 지정 action URL로 데이터 전송을 시도합니다.

하나의 <form> 태그는 하나 이상의 위젯(widget, 웹 화면에 나타나는 영역)을 가지게 됩니다.

<form action="" method="POST">
    <input type="text" /> <!-- 1줄 문자열 입력 -->
    <textarea></textarea> <!-- 1줄 이상의 문자열 입력 -->
    <select></select> <!-- 항목 중 택일 -->
    <input type="checkbox" /> <!-- 체크박스(한 그룹 내 여러 항목을 다수 선택 가능) -->
    <input type="radio" /> <!-- 라디오박스(한 그룹 내 여러 항목 중 하나만 선택 가능) -->
</form>

HTML <form> 태그 필수 속성

action: 요청을 보낼 주소
method: 전송 방식
- GET: 주로 데이터 조회 요청 시에 사용
- POST: 파괴적인 액션(생성/수정/삭제)에서 사용
enctype: 인코딩 방식
- POST 요청에서만 유효
- GET 요청에서는 하나의 enctype으로 강제됨

<form>의 enctype

1. "application/x-www-form-urlencoded" (디폴트)
- GET 요청시 이 유형이 강제됨
- 인자들을 URL 인코딩하여 쿼리 스트링(QueryString) 형태로 전달

- 파일 업로드 불가

2. "multipart/form-data"
- 파일 업로드 가능

(참고) url encode
key=value 값의 쌍이 & 문자로 이어진 형태를 말하며, 공백은 +로 인코딩, Special 문자들은 ascii 16진수 문자열, UTF8 인코딩 16진수 문자열로 변환합니다.

Form 요청에서 인자를 보내는 2가지 방법

1. 요청 URL 뒤에 ?를 붙이고 인자를 실어 보내기(GET 방식)
- x-www-form-urlencoded 인코딩의 값만 실을 수 있음
- 해당 인자를 쿼리 스트링 인자라고 부름
- GET 요청에서 주로 사용하기에 GET 인자라고도 함(POST 요청에서도 쿼리 스트링을 실을 수 있음)

2. 요청 Body에 모든 인코딩 인자를 실어 보내기(POST 방식)
- x-www-form-urlencoded 인코딩 값도 OK
- multipart/form-data 인코딩 값도 OK -> 파일 업로드 가능

GET 요청 예시

1. enctype은 디폴트로 강제되므로 굳이 명시하지 않아도 됨
2. 주로 검색폼에서 인자를 넘길 때 사용(조회 목적)

<form method="GET" action=""> <!-- 장고에선 get과 post를 동일 페이지에서 처리하므로 action 주소를 명시하지 않아도 됨 -->
    <input type="text" name="query" />
    <input type="submit" value="검색" />
</form>

POST 요청 예시

파일 업로드를 수행한다면 필히 enctype을 multipart/form-data로 지정

<form method="POST" action="" enctype="multipart/form-data">
    <input type="text" name="title" />
    <textarea name="content"></textarea>
    <input type="file" name="photo" />
    <input type="submit" value="저장" />
</form>

장고 뷰에서의 인자 접근

1. request.GET
- 모든 쿼리 스트링의 인자 목록(QueryString을 파싱한 QueryDict 객체)
- GET/POST 요청에서 모두 가능

2. request.POST
- POST 요청에서만 가능
- 파일 내역은 제외한 모든 POST 인자 목록(요청 BODY를 파싱한 QueryDict 객체)

3. request.FILES
- POST 요청에서만 가능
- 요청 BODY에서 파일 내역만 파싱한 MultiValueDict 객체

---

HttpRequest 객체

클라이언트로부터 모든 요청 내용을 담고 있으며 1) 함수 기반 뷰에선 매 요청 시마다 뷰 함수의 첫 번째 인자 request로 전달되고, 2) 클래스 기반 뷰에선 매 요청 시마다 self.request를 통해 접근합니다.

MultiValueDict
1. dict을 상속받은 클래스
2. 동일 key의 다수 value를 지원하는 사전
- http 요청에서는 하나의 key에 대해 여러 값을 전달받을 수 있어야 함
- URL의 쿼리 스트링은 같은 key로써 다수 value 지정을 지원 ex) name=Tom&name=Steve&name=Tomi

HttpResponse 객체

django.http.HttpResponse
1. 다양한 응답을 Wrapping: HTML 문자열 및 이미지 등
2. View에서는 반환값으로서 HttpResponse 객체를 기대
   (Middleware에서 HttpResponse 객체를 기대)

django.http.JsonResponse

django.http.StreamingHttpResponse
1. 효율적인 큰(긴) 응답을 위함
- 혹은 메모리를 많이 먹는 응답(iterator를 통한 응답)
2. 장고는 short-lived 요청에 맞게 디자인
- 큰(긴) 응답 시 극심한 성능 저하로 이어질 가능성 존재
3. HttpResponse를 상속받지 않음
- 반드시 iterator를 지정해야만 제대로 동작

django.http.FileResponse
1. StreamingHttpResponse를 상속받음
- 파일 내용 응답에 최적화
- Content-Length, Content-Type, Content-Disposition 헤더 자동 지정
2. 인자
- open_file: Streaming Content
- as_attachment: Content-Disposition 헤더 지정 여부(다운로드를 할 것인지의 여부)
- filename