장고 프론트엔드와 통신 방법: HTTP POST, GET request 처리하기

2022. 1. 28. 10:41·Django
목차
  1. 통신의 흐름
  2. 통신 설정 방법
  3. http request 진행 방법

장고 모델(model) 작업과 url, 뷰(view) 작업을 마쳤다면 HTTP 요청(request)을 통해 프론트엔드와 통신을 테스트할 수 있습니다.

통신의 흐름

장고에서 백엔드와 프론트엔드의 기본적인 통신 흐름은 다음과 같습니다.

  • 백엔드는 장고 서버를 실행하고 프론트엔드에게 엔드포인트와 서버의 ip 주소를 전달합니다.
  • 프론트엔드는 해당 엔드포인트로 원하는 값을 body에 담아 POST 요청을 전달합니다(보통 생성 및 업데이트).
  • GET방식으로도 요청을 진행할 수 있습니다. 이 때는 body가 따로 필요하지 않습니다(보통 데이터를 받아오는 경우).
  • request 형식이 올바르다면 이에 해당하는 response가 상태 코드와 함께 반환됩니다.

통신 설정 방법

  • 외부 서버를 통한 통신이 아니기 때문에 동일한 와이파이 환경에서 테스트를 진행해야 합니다.
  • settings.py 의 allowed_host=['*']를 변경하여 모든 호스트의 접근을 허용하고, corseheaders를 주석 처리해줍니다.
  • 맥의 경우 터미널에서 ipconfig getifaddr en0, 리눅스의 경우 hostname -I 를 통해 서버 실행에 사용되는 자신의 ip 주소를 확인합니다.
  • 장고를 로컬 환경에서 테스트할 때는 127.0.0.1:8000과 같은 주소를 사용했지만 이제 이 부분을 10.58.1.255와 같이 위에서 확인한 ip 주소로 변경해줘야 합니다.
  • python mange.py runserver 0:8000을 통해 서버를 실행합니다.
  • 엔드포인트 request 주소는 10.58.1.255:8000/users/signup과 같이 ip 주소, 포트, url을 결합하여 구성됩니다.

http request 진행 방법

POST 요청의 경우에는 다음과 같이 body에 내용을 담아 요청을 전송할 수 있습니다. 다음은 터미널에서 httipie를 통해 두 가지 요청을 전송하는 방법입니다. (터미널을 통한 통신 이외에도 포스트맨 등 HTTP 요청을 위한 애플리케이션을 사용할 수 있습니다. )

http -v POST 10.58.1.255:8000/users/signup email="user1@gmail.com" password="1234asdF@" note=""

GET 요청은 다음과 같이 요청을 전송할 수 있습니다. 요청 필터링이 필요한 경우, 해당 URL 라인에서 쿼리 파라미터를 전송할 수 있습니다.

http -v GET 10.58.1.255:8000/products?id=1

 

반응형

'Django' 카테고리의 다른 글

장고 ORM과 쿼리셋의 개념  (0) 2022.02.07
장고, 파이썬 csv 파일 처리 방법  (0) 2022.02.01
장고 추상 모델 클래스 생성과 상속 방법  (0) 2022.01.21
장고 암호화 인증 인가 처리: bcrypt, JWT 사용 방법  (0) 2022.01.19
장고 HTTP 리퀘스트 유효성 검사 및 에러 메시지 작성 방법  (0) 2022.01.16
  1. 통신의 흐름
  2. 통신 설정 방법
  3. http request 진행 방법
'Django' 카테고리의 다른 글
  • 장고 ORM과 쿼리셋의 개념
  • 장고, 파이썬 csv 파일 처리 방법
  • 장고 추상 모델 클래스 생성과 상속 방법
  • 장고 암호화 인증 인가 처리: bcrypt, JWT 사용 방법
휘 Hwi
휘 Hwi
개발자 성장 로그
  • 휘 Hwi
    개발자 로그: 변화를 위한 공간
    휘 Hwi
  • 전체
    오늘
    어제
    • 분류 전체보기 (61)
      • 101 (1)
      • Web | Internet (4)
      • HTML | CSS (4)
      • Python (9)
      • Django (20)
      • Javascript (0)
      • Node.js (0)
      • React (0)
      • React Native (0)
      • Database (1)
      • Git (1)
      • Terminal | Vim (1)
      • Auth | Security (4)
      • AWS (0)
      • Docker (0)
      • Kubernetest (1)
      • Deployment (1)
      • Project (2)
      • TIL (12)
  • 블로그 메뉴

    • 홈
    • 방명록
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    css
    깃
    깃 오류
    장고 프로젝트
    요소 상대 크기
    프로젝트 회고
    JWT 인코딩
    장고 Views
    깃 ssh
    JWT 디코딩
    탭내빙
    JWT
    요소 크기 설정
    요소 절대 크기
    배포
    새 탭에서 열기
    HTTP
    장고 URL
    깃 퍼블릭 키 등록
    target="_blank"
    TIL
    정규 표현식
    html
    HTTP GET 요청
    HTTP POST 요청
    함수
    파이썬
    깃 에러 해결
    장고
    파라미터
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.0
휘 Hwi
장고 프론트엔드와 통신 방법: HTTP POST, GET request 처리하기
상단으로

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.