wafflestudio/seminar-2020

browser에서 header에 원하는 값을 넣어 서버에 요청 보내기

Open

#187 opened on Sep 23, 2020

 (0 comments) (8 reactions) (0 assignees)Python (49 forks)auto 404
backendgood first issuetip

Repository metrics

Stars
 (27 stars)
PR merge metrics
 (PR metrics pending)

Description

여러 방법을 이용해 자신의 코드가 DB에 어떤 query를 실행시키는지 확인하는 과정은 서버 개발에서 필수적입니다. 제가 알려드린 도구 중 하나로는 Django Debug Toolbar가 있었는데요. 이를 확인하기 위해서는 browser의 url로 API를 실행시켜야하셨을 것입니다. 그런데 우리는 HTTP header에 token을 넣어 User authentication을 진행하는데, browser에서 이것은 어떻게 가능할까요?

스크린샷 2020-09-24 00 27 24

(위처럼 적절히 예쁜 화면이 browser에서 보이는 것(더 나아가 post, put 등이 있는 url에서는 입력 창까지 있는 것)은 절대 마법 같은 일이 아니라 DRF가 해주는 것임을 깨달아야 합니다. 원래는 그냥 완전 하얀 화면에 response의 텍스트만 덜렁 나오는 식일 것입니다. 아주 기본적인 수준의 frontend 작업을 DRF가 자동으로 해주는 것입니다.)

이를 위한 browser extension 도구들이 있습니다. 다른 browser의 다른 도구들도 있겠지만, Chrome(저는 앱등이라 Safari를 좋아하긴 합니다)의 ModHeader를 이용해 이에 대한 내용을 보여드리겠습니다.

Chrome에 해당 extension을 설치하시면, 우측 상단의 해당 아이콘을 클릭해 Request headers의 key와 value들을 설정해 넣을 수 있습니다.

스크린샷 2020-09-24 00 28 08

몇 가지 아이콘과 기능들이 있는데, 직접 확인해보시기 바라구요. 이렇게 넣어서 다시 요청을 보내보면! header로서 token이 잘 전달된 것을 확인할 수 있답니다.

스크린샷 2020-09-24 00 30 32

평소에 browser를 이용할 때는 이 extension 이용을 일시정지시켜둬야 이상한 일이 발생하지 않겠죠?

여기서 잠깐, HTTP header에 대해 가슴에 손을 얹고 조금이라도 자신이 없다면(더 나아가 그게 실제로 어떤 형태로 서버에 전달되는지), 제가 예전에 아주 열심히 써둔 #108 이슈를 정독하시기 바랍니다~

Contributor guide