JSON 편집 모드

Classic/VPC 환경에서 이용 가능합니다.

CLOVA Chatbot에서 구현 가능한 JSON 입력 양식에 대해 설명합니다. JSON 편집 모드는 연속 답변 및 여러 필수 입력 사항을 채워야 하는 복잡한 답변 유형을 다른 대화로 복사할 때 활용할 수 있습니다.
[JSON 편집 모드] 버튼을 클릭하면 JSON 구조의 데이터를 복사할 수 있고, 복사한 데이터를 다른 대화에 적용하면 복잡하게 설정된 답변 유형을 쉽게 복사할 수 있습니다.

기본 답변

JSON Structure 예시는 다음과 같습니다.

[
  {
    "component": {
      "type": "text",
      "data": {
        "description": "the answer of this query is test",
        "url": "http://www.example.com"
      }
    },
    "answerType": "TEXT"
  }
]

멀티링크 답변

JSON Structure 예시는 다음과 같습니다.

[
  {
    "component": {
      "type": "template",
      "data": {
        "cover": {
          "type": "text",
          "data": {
            "description": "멀티링크의 답변 부분입니다."
          }
        },
        "contentTable": [
          [
            {
              "colSpan": 1,
              "rowSpan": 1,
              "data": {
                "type": "button",
                "title": "naver",
                "data": {
                  "type": "basic",
                  "action": {
                    "type": "link",
                    "data": {
                      "url": "https://www.naver.com/"
                    }
                  }
                }
              }
            }
          ],
          [
            {
              "colSpan": 1,
              "rowSpan": 1,
              "data": {
                "type": "button",
                "title": "google",
                "data": {
                  "type": "basic",
                  "action": {
                    "type": "link",
                    "data": {
                      "url": "https://www.google.com/"
                    }
                  }
                }
              }
            }
          ]
        ]
      }
    },
    "answerType": "MULTILINKS"
  }
]

이미지 답변

JSON Structure 예시는 다음과 같습니다

[
  {
    "component": {
      "type": "carousel",
      "data": {
        "cards": [
          {
            "type": "image",
            "title": "첫 번째 캐로셀의 이미지 제목입니다.",
            "data": {
              "imageUrl": "https://www.image.com/image.png",
              "description": "첫 번째 캐로셀의 이미지 설명입니다."
            }
          },
          {
            "type": "image",
            "title": "두 번째 캐로셀의 이미지 제목입니다.",
            "data": {
              "imageUrl": "https://www.image.com/image.png",
              "description": "두 번째 캐로셀의 이미지 설명입니다."
            }
          }
        ]
      }
    },
    "answerType": "IMAGECARD"
  }
]

Field Introduce

Image Field Introduce

객관식 답변

JSON Structure 예시는 다음과 같습니다.

[
  {
    "component": {
      "type": "text",
      "data": {
        "description": "#{객관식폼이름}"
      }
    },
    "answerType": "SINGLEFORM"
  }
]

연속 답변

연속 답변의 경우 최대 5개의 말풍선을 추가할 수 있습니다.
JSON Structure 예시는 다음과 같습니다.

 [
  {
    "component": {
      "type": "text",
      "data": {
        "description": "답변 예시입니다.",
        "url": "http://www.example.com"
      }
    },
    "answerType": "TEXT"
  },
  {
    "component": {
      "type": "text",
      "data": {
        "description": "#{객관식 폼 이름}"
      }
    },
    "answerType": "SINGLEFORM"
  }
]

Field Introduce
In the array data( array[jsonObject] )，each json object represents a bubble, multiple bubbles correspond to multiple json objects.

Flex 메시지 답변

메신저를 LINE으로 설정한 경우, Flex 메시지 답변을 지원합니다.
JSON Structure 예시는 다음과 같습니다.

[
  {
    "component": {
      "type": "flex",
      "title": "Flex 답변입니다.",
      "data": {
        "type": "bubble",
        "hero": {
          "type": "image",
          "url": "https://scdn.line-apps.com/n/channel_devcenter/img/fx/01_1_cafe.png",
          "size": "full",
          "aspectRatio": "20:13",
          "aspectMode": "cover"
        },
        "body": {
          "type": "box",
          "layout": "vertical",
          "contents": [
            {
              "type": "text",
              "text": "Brown Cafe",
              "weight": "bold",
              "size": "xl"
            }
          ]
        },
        "footer": {
          "type": "box",
          "layout": "vertical",
          "spacing": "sm",
          "contents": [
            {
              "type": "button",
              "style": "link",
              "height": "sm",
              "action": {
                "type": "uri",
                "label": "CALL",
                "uri": "https://linecorp.com"
              }
            },
            {
              "type": "spacer",
              "size": "sm"
            }
          ],
          "flex": 0
        }
      }
    },
    "answerType": "FLEXMESSAGE"
  }
]

Field Introduce

LINE 스티커 답변

메신저를 LINE으로 설정한 경우, LINE 스티커 답변을 지원합니다.
JSON Structure 예시는 다음과 같습니다.

[
  {
    "component": {
      "type": "line_sticker",
      "data": {
        "packageId": "11537",
        "stickerId": "52002734"
      }
    },
    "answerType": "STICKER"
  }
]

Field Introduce