Bot Framework V3 - Getting Started

마이크로소프트 MVP 박문찬입니다. 

기온이 30도인 전형적인 열대야 저녁입니다. 샤워하고, 컴퓨터 앞에 앉자마자 땀이 주르륵;;; 결국 에어컨님의 힘을 빌어서 자리에 죽치고 안아서, 2주 후에 오프라인 모임 때 진행할 Bot Framework V3에 대해서 포스트 작업을 하려고 합니다. 오프라인 모임 때는 작성해 놓은 포스트를 중심으로 따라서 진행하도록 할 예정이니, 미리 예습을 하셔도 좋을 것 같습니다. 그럼, 다시 시작하는 마음으로 Getting Started 포스트를 살펴 볼까요~

 

작업일자 : 2016년 7월 15일 (시간이 지나면 뭐가 바뀌어있을지 알 수 없습니다;;; 눈뜨고 코베어가는 서울 보다 무서운 레드몬드;;;;)

 

윈도우 앱 개발 그룹 7월 오프라인 모임 - 주제 Bot Framework V3 함께 만들기

http://onoffmix.com/event/73081

 

 

0. 참고 포스트 - Getting Started

http://docs.botframework.com/en-us/csharp/builder/sdkreference/

 

 

1. Bot Framework 개요

 

마이크로소프트 Bot Builder는 각종 형태의 상호 작용과 가능성을 명시적으로 사용자에게 제공할 수 있는 봇을 만들 수 있는 강력한 프레임웍 입니다. 이 것은 사용하기 쉽고, C#의 장점을 이용해서 자연스러운 방법으로 봇을 만들 수 있게 합니다.

 

 

높은 수준의 특징

 

. 분리되고 조합가능한 강력한 dialog 시스템 구성

. Yes/No, 문자열, 숫자, 열거 형 같은 간단한 것들을 내장한 dialog 만들기

. LUIS와 같은 강력한 AI 프레임워크를 활용하여 dialog 만들기

. Bots are stateless which helps them scale.

. 자동으로 C#클래스를 이용해서 봇을 생성하고, 도움말, 네비게이션, 설명 및 확인 등을 지원하는 FormFlow를 지원

. 공개된 SDK 소스 http://github.com/Microsoft/botbuilder.

 

 

2. Install

 

인스톨을 하는 과정은 Getting started with the Connector 페이지로 이동해서 계속 진행 하겠습니다.

http://docs.botframework.com/en-us/csharp/builder/sdkreference/gettingstarted.html

 

마이크로소프트 Bot Framework Connector는 내가 만든 bot과 다른 커뮤니케이션 채널들(Skype, SMS, email, other)을 서로 연결시켜주는 역할을 합니다.

 

Bot Framework Connector을 사용하기 위해서는

 

1) MSA(Microsoft Account)를 이용해서 Bot Framework developer portal에 로그인을 해서 당신의 봇을 등록할 수 있습니다.

 

2) Azure REST endpoint를 이용해서 Connector service와 연결합니다.

 

3) 개발자가 접근 가능한 다른 커뮤니케이션 서비스의 계정(Facebook, Skype, 이 있어야 합니다. SMS, Email의 경우에도 뭔가 필요하겠죠?

 

 

3. Getting started in .NET

 

1) Visual Studio 2015 Update 3 (가장 최신 버전)이 필요 합니다. 또한, Extension들의 최신 업데이트도 필요합니다.

 

* Microsoft ASP.NET and Web Tools 업데이트 반드시!!

Windows 10 ver 1607 기념일 업데이트 버전은 아래와 같이 cmd에서 수동으로 입력해서 실행하셔야지 설치가 가능합니다.

DotNetCore.1.0.0-VS2015Tools.Preview2.exe SKIP_VSU_CHECK=1

 

 

* 에뮬레이터 최신버전 3.0.0.57 필요~

 

에뮬레이터 V3 다운로드

http://botframework.blob.core.windows.net/bf-v3/tools/emulator/publish.htm

 

 

2) 봇 템플릿 다운로드 : http://aka.ms/bf-bc-vstemplate

. zip파일(압축을 풀지 않고)을 “%USERPROFILE%\Documents\Visual Studio 2015\Templates\ProjectTemplates\Visual C#" 경로에 복사해서 붙여 넣는다.

예) C:\Users\kaki1\Documents\Visual Studio 2015\Templates\ProjectTemplates\Visual C#

 

3) 비주얼 스튜디오 시작

 

4) 봇 어플리케이션 템플릿으로 프로젝트를 생성

아래와 같이 선택할 수 있어야 있으면 다음으로 진행 합니다.

 

 

5) 템플릿을 이용해서 프로젝트를 생성하면 Echo Bot의 모든 기능을 가지고 있는 프로젝트가 생성됩니다.

그리고, 그 다음에 실행해야 할 사항들 입니다.

. bot을 Bot Connector에 등록하기

. AppId와 AppPassword를 Bot Framework 등록 페이지에서 복사해서 web.config에 붙여 넣기

. bot 프로젝트를 azure에 Published하기

 

 

4. Building your Bot

 

본격적으로 봇을 만들어 보겠습니다. 봇 템플릿의 핵심 기능은 Controllers\MessagesController.cs에 있는 Post 함수에 있습니다. 이 코드에서 사용자의 메시지 텍스트를 얻은 후 CreateReplyMessge를 이용해서 응답 메시지를 생성합니다. [BotAuthentication]은 당신의 봇을 Bot Connector가 인증을 해야하는 것을 명시적으로 나타냅니다.

 

    [BotAuthentication]
    public class MessagesController : ApiController
    {
        /// <summary>
        /// POST: api/Messages
        /// Receive a message from a user and reply to it
        /// </summary>
        public async Task<HttpResponseMessage> Post([FromBody]Activity activity)
        {
            if (activity.Type == ActivityTypes.Message)
            {
                ConnectorClient connector = new ConnectorClient(new Uri(activity.ServiceUrl));

 

                // calculate something for us to return
                int length = (activity.Text ?? string.Empty).Length;

 

                // return our reply to the user
                Activity reply = activity.CreateReply($"You sent {activity.Text} which was {length} characters");
                await connector.Conversations.ReplyToActivityAsync(reply);
            }
            else
            {
                HandleSystemMessage(activity);
            }
            var response = Request.CreateResponse(HttpStatusCode.OK);
            return response;
        }

 

    }

 

위의 코드를 보면 V1과 여러가지 부분이 달라졌다는 것을 알 수 있습니다. Post메소드에 Activity가 생긴 것, ConnectorClient를 생성하는 부분, 회신 메시지를 만드는 CreateReply, 회신 방법 ReplyToActivityAsync 등이 그렇습니다.

느낌으로는 좀더 명확하게 변경되었다고 생각됩니다.

 

 

5. Emulator

 

에뮬레이터는 로컬에서 자신이 만든 봇을 테스트 하기 위한 용도로 사용됩니다. 거기다 이전 버전의 에뮬레이터와는 다르게 채널을 변경하는 기능도 포함되었습니다. 에뮬레이터 다운로드는 위에서 언급했기 때문에 생략 합니다.

 

에뮬레이터를 사용하기 위한 작업을 진행하겠습니다.

 

시작 브라우저를 Microsoft Edge로 지정 합니다. 그 이야기는 IE에서 지원이 않될지도 모르겠네요.. Edge를 사용해야 한다는 것은 Windows 10이 설치된 컴퓨터에서만 개발이 가능하다는..으흐흐...

 

 

프로젝트를 실행하면, default.htm 파일의 내용이 표시됩니다. 음..이쁘게 만들기를 원하시면 직접 꾸미셔도 좋을 것 같습니다.

 

F5키를 눌러서 실행하면 엣지 브라우저에서 아래와 같은 화면이 출력됩니다.

 

 

에뮬레이터를 이용해서 방금 만든 봇을 테스트를 하기 위해서는 port번호를 정확하게 지정해야 합니다. 예를 들어 지금의 화면에서는 3978번이 port 번호입니다.

 

봇 응용프로그램과 에뮬레이터가 상호 작용하기 전에 몇가지 항목을 설정해야 합니다. (하지만.. 기본 설정을 이용해도 잘 됩니다..)

 

1) URL 항목에 Port번호와 뒤에 /api/messages가 추가되어 있어야 합니다.

 

2) MicrosoftAppId는 입력하지 않습니다.

 

3) MicrosoftAppPassword는 입력하지 않습니다.

 

빨간색 테두리 쳐진 곳만 잘 확인하시면 됩니다.

 

 

모든 준비가 끝났다면 당신의 봇에게 인사를 해보도록 하세요. 입력한 글씨가 몇자인지를 반환해 줄 것 입니다.

 

 

 

6. Publishing your Bot Application to Microsoft Azure

 

헬로우 월드와 비슷한 에코 봇을 만들었으니 이제 이 봇을 다른 사람들이 사용할 수 있도록 해야합니다. 다른 사람들이 봇을 사용하기 위해서는 Azure에 Publishing을 해야지만 합니다. 그 과정을 살펴 보도록 하겠습니다.

 

시간과 지면 관계상 Microsoft Azure가 무엇인지에 대한 자세한 사항은 생략 하겠습니다. 만약 Azure에 가입을 하지 않으셨다면,

 

https://azure.microsoft.com/ko-kr/ 

 

사이트를 방문하셔서 무료로 가입을 하시면 됩니다. 또한, 무료 기간이 지나서 요금이 왕창 나오면 어떻게하나 걱정하실 필요가 없습니다. Azure는 사용한 만큼만 요금이 지불되기 때문에 등록했다고해서 요금 폭탄이 떨어지지 않으니 안심하셔도 좋습니다.(가상 머신 서비스 같은 것은 제외;;;)

 

Publish 하실 준비가 되었으면, 솔루션 탐색기에서 오른쪽 마우스 버튼을 클릭해서 컨텍스트 메뉴를 출력하고, Publish 항목을 선택합니다.

 

 

우리가 만든 봇 어플리케이션은 Microsoft Azure App Service로 등록을 해야합니다.

Microsoft Azure App Service를 클릭해서 세부 항목을 입력합니다.

 

 

세부 항목을 지정하기 위한 화면입니다. 오른쪽 상단에 제가 Visual Studio에 입력한 Microsoft account 정보가 출력됩니다. 저 Microsoft account정보와 Azure에 가입한 계정이 동일해야지만 아래 Subscription 콤보 박스에서 선택이 가능합니다.

 

또한, 제 계정 정보 하단에 노란색 Reenter your credentials라는 녀석이 보인다면, 저녀석을 클릭해서 다시 한번 로그인을 해주셔야 콤보 박스에 내용을 지정할 수 있습니다.

 

 

이제 정확한 정보가 표시됩니다. 아마 현장에서 Azure 가입하시고, 바로 진행하실려고 하면 이 부분에서 시간이 오래 지체될 수 있습니다. 미리 가입을 하시는 것이 좋습니다.

 

저는 Default-Web-EastAsia라는 리소스 그룹에 새로운 App Service를 만들겠습니다. New를 클릭합니다.

 

 

대략 내용을 확인 후 Create 버튼을 클릭합니다. Resource Group, App Service Plan 등은 사용자가 임의로 만들어서 사용할 수 있는 것들이기 때문에 크게 의미는 없습니다.

 

 

모든 정보가 정상적으로 등록이 된 후 아래와 같은 최종 Web Deploy 화면이 출력됩니다. 여기서 Destination URL에 출력된 주소를 복사해서 보관하세요!

 

그 외 Publish된 내용을 Debug하셔야 하는 경우에는 Next를 눌러서 Debug로 변경하시면 되고, Validate Connection을 눌러서 잘 연결되었는지 확인도 해주시기 바랍니다.

 

최종적으로 Publish 버튼을 눌러서 배포 합니다.

 

 

 

7. Registering your Bot with the Microsoft Bot Framework

 

자 그럼 내가 만든 봇을 Azure에 배포를 하였으니, 남은 작업은 봇을 Bot Framework portal에 등록하는 작업을 계속 진행 하겠습니다.

 

이 작업은 Bot Connector에서 Azure에 등록된 봇의 Endpoint를 이용해서 서로 데이터를 주고 받을 수 있도록 하는 작업이며, 이 과정을 진행하는 동안 MicrosoftAppId와 MicrosoftAppPassword를 만들 수 있습니다.

 

1) Microsoft Bot Framework portal로 이동합니다. https://dev.botframework.com 그리고, Microsoft Account로 가입하거나 로그인 합니다.

 

2. 상단 메뉴 중 Register a bot을 클릭해서 Bot을 등록합니다.

Name, Bot handle, Description 등을 적당히 입력하시고, 중요한 부분은 Configuration에 Messaging endpoint 부분에 아까 복사해 놓았던 Destination URL과 /api/messages을 입력하시면 됩니다.

 

https://kakisamplebotv320160714111119.azurewebsites.net/api/messages

 

https와 /api/messages 두가지를 주의 하세요!!

 

그리고, Create Microsoft App ID and password를 클릭하셔서 계속 진행 합니다.

 

 

MicrosoftAppId와 MicrosoftAppPassword를 이렇게 구한 후 다시 원래 페이지로 이동 합니다.

 

나머지 필수 항목들을 채워 넣으신 후에 Register 버튼을 클릭합니다.

 

 

Bot V3가 등록 되었습니다~ ㅎㅎㅎ

 

이렇게 등록되었다고, 바로 테스트를 들어가시면 않됩니다. 방금 입력하고 만든 정보 3가지를 Web.config에 입력하신 후에 다시 Publish를 해 주셔야 정상 동작합니다.

 

BotId : Bot handle에 입력한 정보

MicrosoftAppId, MicrosoftAppPassword : 아까 작업 중에 만들어진 값 입력

 

Publish를 다시 하신 후 Portal에서 Test 버튼을 클릭하시면 Endpoint authorization successed라는 글씨가 출력되면 정상적으로 연결된 것입니다.

 

 

아래는 Web Chat을 이용해서 ifram 코드를 붙여 넣은 것입니다. 음 V1과 외관상으로는 차이가 없습니다.

다음에는 좀더 발전된 형태의 봇 만드는 방법에 대한 포스트를 작성하도록 하겠습니다.