[Mockoon] Route에 paramer 설정하기

새로운 프로젝트에서 UI를 개발하던 중, API 개발이 지연되어 Mockoon을 활용해 mock 데이터를 사용하여 기능을 구현하게 되었습니다. 이 과정에서 Mockoon에 파라미터를 설정하는 방법에 대한 자료가 부족한 것 같아 짧게 정리해 보았습니다.

 

Mockoon에 대한 설명이나 설치 방법은 아래 블로그를 참고하시면 좋을 것 같습니다.

Mockoon을 활용한 프론트엔드 개발 효율성 향상: 가상서버 및 Proxy 설정

 

Parameter 설정하는 방법

HTTP route를 생성하면 위 사진처럼 route가 추가되고 url과 response 등을 설정할 수 있습니다.

 

그리고 query parameter를 설정하려고 하면 우측 상단처럼 경고 메시지가 뜨는데요

 

해당 오류 메시지는 Mockoon에서 라우트를 선언할 때 쿼리 파라미터(?category=TEST와 같은)를 직접 경로에 포함시킬 수 없다는 의미입니다.

 

즉, 경로 자체에 쿼리 파라미터를 포함할 수 없고, 쿼리 파라미터는 라우트 호출 시 별도로 추가해야 한다는 뜻입니다.

 

그렇기 때문에 route에 parameter를 추가하기 위해서는 Reponse를 추가하고, 각 Reponse마다 Rules 탭으로 들어가서 Add rule을 통해 GET인 경우 query param을 설정하고, POST/PUT/DELETE인 경우 body(data) 넣어주시면 됩니다.

 

JSONPath는 JSON 데이터를 쿼리하는 방식으로, 경로에 따라 데이터를 선택할 수 있도록 해줍니다.

 

예를 들어 아래와 같은 JSON에서 name의 값을 가지고 조건을 처리하고 싶다면

{
  "store": {
    "book": [
      {
        "category": "fiction",
        "title": "The Great Gatsby",
        "author": "F. Scott Fitzgerald",
        "price": 10.99
      },
      {
        "category": "non-fiction",
        "title": "Sapiens",
        "author": "Yuval Noah Harari",
        "price": 14.99
      },
      {
        "category": "fiction",
        "title": "1984",
        "author": "George Orwell",
        "price": 12.99
      }
    ],
    "bicycle": {
      "color": "red",
      "price": 199.99
    }
  }
}

 

JSONPath에는 " $.store.book[*].title"를 입력하고 value에는 원하는 값을 설정하면 됩니다.