Mock(가짜) 서버 준비하기

Mock 서버는 무엇인가?

실제 서버처럼 vue가 요청을 하면 그것에 대해서 응답을 해주는 가짜 서버를 의미한다. 우리가 프로젝트를 할 때 서버 연결까지 하려면 너무 공부해야할 게 많으니 Mock 서버를 활용해서 서버처럼 쓰는 것이다.

Postman 설치하기

• 설치 링크
  https://www.postman.com/downloads/
  설치를 한 후에 sign in을 한다.

use authorization token to sign in을 누르면 token이 나오는데 그 token을 Postman 프로그램에서 sign in 할 때 입력해주면 된다.

Mock 서버 만들기

Start with something new 클릭

Mock Server 클릭

Request URL에 productList라고 적어주고 Next 버튼 클릭

Mock server name에 Mock Server 02라고 입력하고 Create Mock Server 클릭

Mock Server가 만들어지면 Mock Server 02 -> productList -> Default로 들어간다.

그리고 Body에서 Text로 되어있는 것을 JSON으로 변경한다.

productList 예시를 넣고 Save 버튼을 누른다.

[
    {"product_name": "기계식 키보드", "price": 25000, "category":"노트북/태블릿", "delivery_price":5000},
    {"product_name": "무선마우스", "price": 12000, "category":"노트북/태블릿", "delivery_price":5000},
    {"product_name": "아이패드", "price": 725000, "category":"노트북/태블릿", "delivery_price":5000},
    {"product_name": "태블릿 거치대", "price": 32000, "category":"노트북/태블릿", "delivery_price":5000},
    {"product_name": "무선충전기", "price": 42000, "category":"노트북/태블릿", "delivery_price":5000}
]

Run collection 클릭

No Environment -> Mock Server 02로 바꿔주고 Run Mock Server02 클릭

Mock Server가 만들어진 것을 확인하고 하단에 Console 클릭

이 url이 우리가 호출할 수 있는 url이다. 이것을 호출하면 데이터를 받아올 수 있는 것이다.