[KAKAO + FLASK] 카카오 챗봇 만들기 (4) - 챗봇 출력 예제

0. 들어가기

-. 카톡 챗봇 출력을 종류별로 실행하는 예제를 작성해 본다. 카톡 도움말 따라서 진행

 

1. 챗봇 출력 테스트

-. 출력 테스트를 위해 간단하게, 챗봇에 메시지로출력의 종류를 보내고, 서버에서는 해당 키워드에 해당하는 출력을 보내는 코드를 작성했다. 

payloads = request.get_json()

#요청 응답타입 구분
try:
	outputType = payloads['action']['params']['type_outputs']
except:
	outputType = None

1) simpleText

-. 가장 간단한 메시지 출력 (기본 카톡 메시지)

if outputType == 'simpleText':
	_ret = {"version": "2.0",
			"template": {"outputs": [{'simpleText': {"text": outputType}}] #"template"의 "outputs" 키 내에
						}
			}
elif outputType == 'simpleImage':
	_ret = {"version": "2.0",
			"template": {"outputs": [{'simpleImage': {"altText": outputType,
			"imageUrl": "https://store.stocksidekick.xyz/static/images/ryan.png"}}] #"template"의 "outputs" 키 내에
						}
			}

 

2) simpleImage

-. 그림 하나 전송 (이미지 링크를 전달하면, 해당 이미지가 출력됨)

                elif outputType == 'simpleImage':
                    _ret = {"version": "2.0",
                            "template": {"outputs": [{'simpleImage': {"altText": outputType,
                                                                      "imageUrl": "https://store.stocksidekick.xyz/static/images/ryan.png"}}] #"template"의 "outputs" 키 내에
                                         }
                            }

3) basicCard

-. 이미지 하나, 버튼 3개 까지의 기본형 카드

                elif outputType == 'basicCard':
                    print(outputType)
                    _ret = {"version": "2.0",
                            "template": {"outputs": [{'basicCard': {"title": "basicCard",
                                                                    "description": "basicCardDescriptionTest",
                                                                    "thumbnail": {"imageUrl": "https://store.stocksidekick.xyz/static/images/ryan.png",
                                                                                  "link": {"web": "https://store.stocksidekick.xyz/static/images/ryan.png"
                                                                                           }},
                                                                    "buttons": [
                                                                        {
                                                                            "action": "message",
                                                                            "label": "버튼#1-메시지",
                                                                            "messageText": "버튼1메시지"
                                                                        },
                                                                        {
                                                                            "action": "webLink",
                                                                            "label": "버튼#2-웹링크네이버",
                                                                            "webLinkUrl": "https://www.naver.com/"
                                                                        },
                                                                        {
                                                                            "action": "share",
                                                                            "label": "버튼#3-공유하기",
                                                                        }
                                                                    ]
                                                                    }
                                                      }
                                                     ]
                                         }
                            }

4) listCard

-. 카톡 샾(#)검색과 비슷한 형태의 출력한다. ※ 각 라인마다 이미지를 개별로 입력 가능

                elif outputType == 'listCard':
                    print(outputType)
                    _ret = {"version": "2.0",
                            "template": {"outputs": [{
                                "listCard": {
                                  "header": {
                                    "title": "listCard 테스트"
                                  },
                                  "items": [
                                    {
                                      "title": "listCard 테스트#1",
                                      "description": "listCard 테스트#1 description",
                                      "imageUrl": "https://store.stocksidekick.xyz/static/images/ryan.png",
                                      "link": {
                                        "web": "https://www.naver.com"
                                      }
                                    },
                                    {
                                      "title": "listCard 테스트#2",
                                      "description": "listCard 테스트#2 description",
                                      "imageUrl": "https://store.stocksidekick.xyz/static/images/ryan.png",
                                      "link": {
                                        "web": "https://www.naver.com"
                                      }
                                    },
                                    {
                                      "title": "listCard 테스트#3",
                                      "description": "listCard 테스트#3 description",
                                      "imageUrl": "https://store.stocksidekick.xyz/static/images/ryan.png",
                                      "link": {
                                        "web": "https://www.naver.com"
                                      }
                                    },
                                  ],
                                  "buttons": [
                                    {
                                      "label": "네이버링크",
                                      "action": "webLink",
                                      "webLinkUrl": "https://www.naver.com"
                                    }
                                  ]
                                }
                              }
                            ]
                            }
                            }

-. 해당 작업 내용이 담긴 git link