2-6 서버-클라이언트 통신 이해하기 _ JSON / JSONView /API

JSON?

JavaScript Object Notation

• 데이터를 저장하거나 전송할때 사용되는 Data교환 형식.
• Key:Value로 이루어져 있음

RealtimeCityAir라는 키 값에 딕셔너리 형 value

 

row라는 키 값에 리스트형 value

---

JSON view?

JSON을 더 깔끔하게 볼 수 있게 해줌.

설치: https://chrome.google.com/webstore/detail/jsonview/chklaanhfefbnpoihckbnefhakgolnmc?hl=ko

JSONVue

 

 

---

API (요청 : 클라이언트→서버)

API는 은행창구 같은것.

   예) A 창구 : ‘아이디’를 가져와 그럼 주문내역을알려줄게 B 창구: 주소를 가져와 그럼 음식점을알려줄게

http://우리은행용산지점/입출금창구?신분증

                    ↑                      ↑              ↑

              웹사이트                API     아이디, 주소 등등...

 

 

✔️  같은 예금 창구에서도 개인 고객이냐 기업 고객이냐에 따라 가져와야 하는 것 / 처리해주는 것이 다른 것처럼,

      클라이언트가 요청 할 때에도, "타입" (GET/POST)이라는 것이 존재함.

• GET: 데이터 조회 (read)를 요청할 때 
            예) 영화 목록 조회
• Post: 데이터 생성 (Create), 변경(Update), 삭제(Delete)요청할 때
            예) 회원가입, 회원탈퇴, 비밀번호 수정

   ⭐️GET 방식으로 데이터를 전달하는 방법:
 google.com/search?q=아이폰&sourceid=chrome&ie=UTF-8
                서버주소
                전달 할 데이터    
                여기서 부터 전달할 데이터가 작성된다는 뜻. 
         &    전달할 데이터가 더 있다는 뜻
              **위 예시는 google.com의 search 창구에 아래와 같은 정보를 전달
                      q=아이폰 (검색어)
                      sourceid=chrome (브라우저 정보)
                      ie=UTF-8 (인코딩 정보)

 

 

💡 전달할 데이터를 어떤문자/코드/형식으로 줄것인지는 프론트 엔드 & 백엔드 개발자가 미리 정함.

     예) https://movie.naver.com/movie/bi/mi/basic.naver?code=161967

    프론트엔드: "code라는 이름으로 영화번호를 주면 될까요?"

    백엔드: "네 그렇게 하시죠. 그럼 code로 영화번호가 들어온다고 생각하고 코딩하고 있을게요"