--- title: "Basic" slug: "ai-application-service-chatbot-basic" updated: 2026-07-23T09:04:22Z published: 2026-07-23T09:04:22Z canonical: "api.ncloud-docs.com/ai-application-service-chatbot-basic" --- > ## Documentation Index > Fetch the complete documentation index at: https://api.ncloud-docs.com/llms.txt > Use this file to discover all available pages before exploring further. # Basic Classic/VPC 환경에서 이용 가능합니다. 챗봇 답변의 응답 컴포넌트 중 Basic 컴포넌트에 대해 설명합니다. Basic 컴포넌트는 다음 3가지 기본 컴포넌트로 구성됩니다. - [Text](/docs/ai-application-service-chatbot-basic#Text%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8) - [Image](/docs/ai-application-service-chatbot-basic#Image%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8) - [Button](/docs/ai-application-service-chatbot-basic#Button%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8) (Button 컴포넌트는 [Quick Buttons](/docs/ai-application-service-chatbot-basic#quickButtons%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8) 컴포넌트를 포함합니다.) 위 컴포넌트는 각 특징에 맞게 챗봇의 응답을 챗봇 빌더에서 설정할 수 있으며, 챗봇 빌더를 통해 설정한 응답 결과를 JSON 형태로 반환합니다. ## Text 컴포넌트 Text 컴포넌트는 제목(Title), 하위 제목(Sub Title), 설명(Description)과 URL으로 구성됩니다. ### Text 컴포넌트 응답 바디 Text 컴포넌트의 응답 바디는 다음과 같습니다. | 필드 | 타입 | 필수 여부 | 설명 | | --- | --- | --- | --- | | `type` | String | - | 컴포넌트 유형 - Text 컴포넌트일 경우 3가지 기본 컴포넌트 중 `text`만 사용 가능 | | `title` | String | - | 컴포넌트 제목 - 단문의 굵은 텍스트 (Short bold text) | | `subTitle` | String | - | 하위 컴포넌트 제목 - 단문의 회색 텍스트 (Short gray text) | | `data` | Object | - | 텍스트(Text) 컴포넌트 구성 정보 | | `data.description` | String | - | 컴포넌트 상세 설명 - 장문의 텍스트 | | `data.url` | String | - | 컴포넌트 하이퍼링크 URL - <예시> `ncloud.com` | | `data.urlAlias` | String | - | 컴포넌트 하이퍼링크 URL 별칭 - 하이퍼링크가 보여지는 텍스트 - <예시> `네이버 클라우드` | | `data.action` | Action | - | 컴포넌트 액션(Action) 정보 - 각 액션마다 세부 내용이 상이하므로 자세한 설명은 [Action 컴포넌트](/docs/ai-application-service-chatbot-action) 참조 | ### Text 컴포넌트 응답 예시 Text 컴포넌트의 응답 예시는 다음과 같습니다. ``` { "type": "text", "title": "optional, short bold text", "subTitle": "optional, short gray text", "data" : { "description" : "optional, a long text content", "url" : "optional, a hyperlink at the bottom of description", "urlAlias" :"optional, hyperlink show this alias", "action": {Action Data} } } ``` ## Image 컴포넌트 Image 컴포넌트는 이미지와 함께 제목(Title), 하위 제목(Sub Title), 설명(Description), URL로 구성됩니다. ### Image 컴포넌트 응답 바디 Image 컴포넌트의 응답 바디는 다음과 같습니다. | 필드 | 타입 | 필수 여부 | 설명 | | --- | --- | --- | --- | | `type` | String | - | 컴포넌트 유형 - Image 컴포넌트일 경우 3가지 기본 컴포넌트 중 `image`만 사용 가능 | | `title` | String | - | 컴포넌트 제목 - 단문의 굵은 텍스트 (Short bold text) | | `subTitle` | String | - | 하위 컴포넌트 제목 - 단문의 회색 텍스트 (Short gray text) | | `data` | Object | - | 이미지(Image) 컴포넌트 구성 정보 | | `data.imageUrl` | String | - | 이미지 URL - 반드시 `https` 형식의 URL이어야 함 | | `data.alt` | String | - | 이미지 설명 툴팁 - 이미지에 마우스를 올렸을 때 표시되는 짧은 힌트 | | `data.imagePosition` | String | - | 이미지 위치 - `top` (기본값) \| `bottom` \| `left` \| `right` - `top`: 가장 위쪽 - `bottom`: 가장 아래쪽 - `left`: 가장 왼쪽 - `right`: 가장 오른쪽 | | `data.description` | String | - | 이미지 상세 설명 | | `data.url` | String | - | 이미지 하이퍼링크 URL - `description`의 아래쪽에 위치 - <예시> `ncloud.com` | | `data.urlAlias` | String | - | 이미지 하이퍼링크 URL 별칭 - 하이퍼링크가 보여지는 텍스트 - <예시> `네이버 클라우드` | | `data.action` | Action | - | 컴포넌트 액션(Action) 정보 - 각 액션마다 세부 내용이 상이하므로 자세한 설명은 [Action 컴포넌트](/docs/ai-application-service-chatbot-action) 참조 | ### Image 컴포넌트 응답 예시 Image 컴포넌트의 응답 예시는 다음과 같습니다. ``` { "type": "image", "title": "optional, short bold text", "subTitle": "optional, short gray text", "data" : { "imageUrl" : "https://ssl.pstatic.net/CloudFunctions.png", "alt" : "optional, short hint show when hover on image", "imagePosition" : "top", "description" : "optional, details info of image", "url" : "optional, a hyperlink at the bottom of description", "urlAlias" : "optional, hyperlink show this alias", "action": {Action Data} } } ``` ## Button 컴포넌트 Button 컴포넌트는 이미지와 함께 제목(Title), 하위 제목(Sub Title), 설명(Description), URL로 버튼(Button)을 구성합니다. Quick Button 컴포넌트도 Button 컴포넌트에 포함됩니다. ### Button 컴포넌트 응답 바디 Button 컴포넌트의 응답 바디는 다음과 같습니다. | 필드 | 타입 | 필수 여부 | 설명 | | --- | --- | --- | --- | | `type` | String | - | 컴포넌트 유형 - Button 컴포넌트일 경우 3가지 기본 컴포넌트 중 `button`만 사용 가능 | | `title` | String | - | 컴포넌트 제목 - 버튼에 보여지는 단문의 굵은 텍스트 (Short bold text) | | `subTitle` | String | - | 하위 컴포넌트 제목 - 단문의 회색 텍스트 (Short gray text) | | `data` | String | - | 버튼(Button) 컴포넌트 구성 정보 | | `data.type` | String | - | 버튼 종류 - `basic` \| `imageButton` - `basic`: 기본 버튼 - `imageButton`: 이미지로 구성된 버튼 | | `data.iconUrl` | String | - | 버튼 아이콘 URL - 반드시 `https` 형식의 URL이어야 함 | | `data.action` | Action | - | 컴포넌트 액션(Action) 정보 - 각 액션마다 세부 내용이 상이하므로 자세한 설명은 [Action 컴포넌트](/docs/ai-application-service-chatbot-action) 참조 | ### Button 컴포넌트 응답 예시 Button 컴포넌트의 응답 예시는 다음과 같습니다. #### Basic Button Basic Button의 응답 예시는 다음과 같습니다. ``` { "type": "button", "title": "optional, text show on button", "subTitle": "optional, short gray text", "data" : { "type": "basic", "iconUrl" : "https://ssl.pstatic.net/CloudFunctions.png", "action": {Action Data} } } ``` #### Image Button Image Button의 응답 예시는 다음과 같습니다. ``` { "type": "button", "title": "optional, text show on button", "subTitle": "optional, short gray text", "data" : { "type": "imageButton", "iconUrl" : "https://ssl.pstatic.net/CloudFunctions.png", "action": {Action Data} } } ``` ### Quick Buttons 컴포넌트 Quick Buttons 컴포넌트에 대해 설명합니다. 채팅창 하단에 있는 그룹 고정 버튼입니다. `button` 컴포넌트에 포함됩니다. #### Quick Buttons 응답 바디 Quick Buttons의 응답 바디는 다음과 같습니다. | 필드 | 타입 | 필수 여부 | 설명 | | --- | --- | --- | --- | | `type` | String | - | 컴포넌트 유형 - Button 컴포넌트일 경우 3가지 기본 컴포넌트 중 `button`만 사용 가능 | | `title` | String | - | 컴포넌트 이름 | | `data` | Object | - | 컴포넌트 구성 정보 | | `data.type` | String | - | 컴포넌트 유형 - `text` \| `image` \| `button` \| `template` \| `carousel` \| `flex` \| `line_sticker` \| `lineworks_sticker` \| - 각 컴포넌트에 대한 자세한 내용은 [Basic 컴포넌트 상세 정보](/docs/ai-application-service-chatbot-basic), [Composite 컴포넌트 상세 정보](/docs/ai-application-service-chatbot-composite), [Flex 컴포넌트 상세 정보](/docs/ai-application-service-chatbot-flex) 참조 | | `data.action` | Object | - | 컴포넌트 액션(Action) 정보 | | `data.action.type` | String | - | 컴포넌트 액션 유형 - `postback` \| `utterance` \| `link` \| `phone` \| `welcome` - `postback`: [Postback 컴포넌트](/docs/ai-application-service-chatbot-action#Postback%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8) 참조 - `utterance`: [Utterance 컴포넌트](/docs/ai-application-service-chatbot-action#Utterance%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8) 참조 - `link`: [Link 컴포넌트](/docs/ai-application-service-chatbot-action#Link%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8) 참조 - `phone`: [Phone 컴포넌트](/docs/ai-application-service-chatbot-action#Phone%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8) 참조 - `welcome`: [Welcome 컴포넌트](/docs/ai-application-service-chatbot-action#Welcome%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8) 참조 | | `data.action.data` | Object | - | 컴포넌트 액션(Action) 상세 정보 - 각 액션마다 세부 내용이 상이하므로 자세한 설명은 [Action 컴포넌트](/docs/ai-application-service-chatbot-action) 참조 | | `data.action.data.postback` | String | - | 챗봇에 포스트백한 텍스트 | | `data.action.data.displayText` | String | - | 챗봇에 표시될 퀵버튼(Quick Button) 이름 | | `data.action.data.postbackFull` | String | - | 퀵버튼 실행을 위해 챗봇에 포스트백한 텍스트 | #### Quick Buttons 응답 예시 Quick Buttons의 응답 예시는 다음과 같습니다. ``` { "quickButtons": [ { "type": "button", "title": "Button Name", "data": { "type": "basic", "action": { "type": "postback", "data": { "postback": "UnexpiredForm\u241e47954\u241e0", "displayText": "Button Name", "postbackFull": "_T_UnexpiredForm\u241e47954\u241e0" } } } } ] } ```