Publish your Bot Framework Composer bot with already provisioned resources in Azure
Tags: azure, botframework, cognitiveservices, lowcode
Published: 2020-06-16 00:51:47

In Oct 2019 at Microsoft Ignite, Microsoft <a href="https://www.google.com/url?sa=t&amp;rct=j&amp;q=&amp;esrc=s&amp;source=web&amp;cd=&amp;cad=rja&amp;uact=8&amp;ved=2ahUKEwjOvYnLioHqAhXNV30KHYykCqMQwqsBMAF6BAgJEAc&amp;url=https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3D1CE86ftA-28&amp;usg=AOvVaw0Wr01DE6eUwnVa3N4GIv2V">released</a> <a href="https://www.arafattehsin.com/build-a-flight-tracker-using-bot-framework-composer-part-1/#botframework-composer">Bot Framework Composer</a> in public preview with handful of fantastic features to build some really cool bots (not for production because of a preview). From the first day of its release, it was quite stable to play with and build some new Conversational AI features such as LG, LU and Common Expressions Language (aka Adaptive Expressions now). Fast forward from October, 2019 to May 2020, the team shipped the first Bot Framework Composer version as <a href="https://techcommunity.microsoft.com/t5/azure-ai/build-2020-conversational-ai-updates/ba-p/1397685"><strong>Generally Available</strong></a> with tons of new <a href="https://docs.microsoft.com/en-us/composer/onboarding">features</a>. It was not easy to push so many changes within this short span of time with the <strong><a href="https://docs.microsoft.com/en-us/composer/setup-yarn"><em>brand new desktop client</em></a>. </strong>

One of those features was about publishing it to Azure with a straight forward and fast experience. While it's great when you're provisioning (or creating) the resources such as LUIS, App Services and the like right from the scratch (through Composer's deployment scripts) it <del>is</del> was really challenging for those who already have these resources created in Azure Portal (just like ME 😊). The reason for this is that the <a href="https://docs.microsoft.com/en-us/composer/how-to-publish-bot">current docs</a> unfortunately, talks only about provisioning the new resources. <em>This is absolutely acceptable because the team is dedicated towards delivering the best experience by prioritizing the features for the customers. </em>

Therefore, in order to address this challenge, I headed to the ultimate source of engagement with the right team i.e. GitHub's repo. I first checked if someone else has reported the similar issue or not and there I noticed <a href="https://github.com/microsoft/BotFramework-Composer/issues/3338#issuecomment-640070079">one of them</a> was there - hence I wrote my experience with the publish option.

<img class="aligncenter size-full wp-image-30931" src="https://www.arafattehsin.com/wp-content/uploads/2020/06/GitHub-Issue-BotFramework-Composer-Publish.jpg" alt="Bot Framework Composer GitHub Issue - Publish Bot" width="767" height="317" />

Then after one or two comments between me and the engineering team in which <a href="https://github.com/microsoft/BotFramework-Composer/issues/3338#issuecomment-641138835">they guided me</a> but also acknowledged that <a href="https://github.com/microsoft/BotFramework-Composer/issues/3338#issuecomment-641892798">there was a scenario</a> (<em>solution is discussed later in this blog post</em>) which might have been missed. Did you know when <a href="https://github.com/microsoft/BotFramework-Composer/pull/3364">they shipped</a> the fix? <strong>Right within 24 hours! ⏳ </strong>Isn't it fantastic?
<blockquote>Bot Framework Engineering team is releasing nightly builds for Composer with the incremental feature changes, fixed issues and much more.</blockquote>
<h2>Let's talk about publishing 📰</h2>
So as I wrote earlier, if your resources are not already provisioned then I'd highly recommend you to go through the <a href="https://docs.microsoft.com/en-us/composer/how-to-publish-bot">Official Documentation</a> of Bot Framework Composer. If you already have the resources provisioned then this is the right place for now!

In order to publish your Bot, you must provide the below information to create your Publish profile.

<img class="aligncenter size-full wp-image-30932" src="https://www.arafattehsin.com/wp-content/uploads/2020/06/Composer-Publish-Details.png" alt="Bot Framework Composer Publish Profile" width="1241" height="837" />

&nbsp;

Now let's analyze what you really need in terms of <strong>Publish Configuration</strong>
<pre class="EnlighterJSRAW" data-enlighter-language="json">{
  "accessToken": &lt;check access token section&gt;",
  "settings": {
    "applicationInsights": {
      "InstrumentationKey": "&lt;check applicaiton insights section&gt;"
    },
    "cosmosDb": {
      "cosmosDBEndpoint": "&lt;check cosmosdb section&gt;",
      "authKey": "&lt;check cosmosdb section&gt;",
      "databaseId": "&lt;check cosmosdb section&gt;",
      "collectionId": "&lt;check cosmosdb section&gt;",
      "containerId": "&lt;check cosmosdb section&gt;"
    },
    "blobStorage": {
      "connectionString": "&lt;check blob section&gt;",
      "container": "&lt;check blob section&gt;"
    },
    "luis": {
      "authoringKey": "&lt;check luis section&gt;",
      "authoringEndpoint": "&lt;check luis section&gt;",
      "endpointKey": "&lt;check luis section&gt;",
      "endpoint": "&lt;check luis section&gt;",
      "region": "&lt;check luis section&gt;"
    },
    "MicrosoftAppId": "&lt;check app section&gt;",
    "MicrosoftAppPassword": "&lt;check app section&gt;"
  },
  "hostname": "&lt;check web app / function section&gt;",
  "luisResource": "&lt;check luis section&gt;"
}</pre>
<h3>Access Token</h3>
Get the <a href="https://docs.microsoft.com/en-us/cli/azure/install-azure-cli?view=azure-cli-latest">Azure CLI</a> installed on your machine (if you don't have it already) and then write this in your Windows Terminal;

<code class="EnlighterJSRAW" data-enlighter-language="generic">az account get-access-token</code>

<img class="aligncenter size-full wp-image-30934" src="https://www.arafattehsin.com/wp-content/uploads/2020/06/Azure-Access-Token.png" alt="Azure Access Token for Bot Framework Composer" width="859" height="511" />

Once you get the Azure access token, copy it and paste it there in the JSON by replacing <em>&lt;check access token section&gt;.</em>
<h3>Application Insights</h3>
For this, you just need to go to your Application Insights resource in Azure Portal (most of the time, it's of the same name as Bot Channels Registration) and then just copy the Instrumentation Key.

<img class="aligncenter size-full wp-image-30935" src="https://www.arafattehsin.com/wp-content/uploads/2020/06/Application-Insights-for-Bot-Framework-Composer.png" alt="Application Insights for Bot Framework Composer" width="1645" height="669" />
<h3>CosmosDB</h3>
You must have the Azure Cosmos DB Account created in your Azure Portal. Once you've created it (in my case, its name is amacosmosdb) then you must create a Database. The container will automatically be created by the Composer so you don't have to worry about it.

<img class="aligncenter size-full wp-image-30936" src="https://www.arafattehsin.com/wp-content/uploads/2020/06/CosmosDB-Account.jpg" alt="Azure CosmosDB account for Bot Framework Composer" width="939" height="494" />

&nbsp;

Once you've created, you can click on the database you just created and then go to the Keys section from your left pane. So based upon these keys, what is what?
<ul>
 	<li>"cosmosDBEndpoint" is the URI</li>
 	<li>"authKey" is the Primary Key</li>
 	<li>"databaseId" is your database name (you just created)</li>
 	<li>"collectionId" is "botstate-collection" (keep them as it is)</li>
 	<li>"containerId" is "botstate-container" (keep them as it is)</li>
</ul>
<img class="aligncenter size-full wp-image-30937" src="https://www.arafattehsin.com/wp-content/uploads/2020/06/Azure-Cosmos-DB-Keys.png" alt="Azure Cosmos DB Keys for Bot Framework Composer" width="687" height="704" />
<h3>LUIS</h3>
This is the trickiest one. I had to play with it a lot in order to get my bot published and I learnt a lot from this so thought to pass on my knowledge to all of you. What I have learnt..
<ol>
 	<li>If you have not migrated your LUIS app to the Azure, then it's a HIGH time to do so. Migrate them before even creating any bot from Composer.</li>
 	<li>Create your both (Authoring and Prediction) LUIS resources within the same region or else you may not see your bot published. Read <a href="https://github.com/microsoft/BotFramework-Composer/issues/3338#issuecomment-642436794">this</a> for a reason.</li>
 	<li>If you're creating a LUIS app from Composer then provide the <strong>authoring key</strong> to the Composer.<img class="aligncenter size-full wp-image-30938" src="https://www.arafattehsin.com/wp-content/uploads/2020/06/LUIS-AuthoringKey.jpg" alt="LUIS Authoring key for App Creation from Microsoft Bot Framework" width="553" height="792" />
In case you want to change your region and default language, you can do so by going to the settings in Composer.</li>
 	<li>If you're creating an app from LUIS portal, then please ensure you already have attached the Authoring resource with this LUIS app.</li>
 	<li>In both of the cases (whether you have an app created either from LUIS portal or Composer, you ensure that the prediction resource is attached to the LUIS app)<img class="aligncenter size-full wp-image-30939" src="https://www.arafattehsin.com/wp-content/uploads/2020/06/LUIS-Prediction-Resource.png" alt="LUIS Prediction Resource for Bot Framework Composer" width="1275" height="732" /></li>
 	<li>Now, just notice that you will be having a different endpoints for Authoring and Prediction.</li>
</ol>
All good? Now let's see what's what in our publish profile configuration.
<ul>
 	<li>"authoringKey" is the primary key of LUIS Authoring resource</li>
 	<li>"authoringEndpoint" is the endpoint from Keys and Endpoint section of LUIS Authoring resource</li>
 	<li>"endpointKey" is the primary key of LUIS Prediction resource</li>
 	<li>"endpoint" is the endpoint from Keys and Endpoint section of LUIS Prediction resource</li>
 	<li>"region" should only be one (as I discussed in point #2), you can also modify this by going to the Bot Framework Composer settings.</li>
 	<li>"luisResource" is the name of your Prediction resource, in my case, it's <strong>luisdemoservice</strong></li>
</ul>
<img class="aligncenter size-full wp-image-30940" src="https://www.arafattehsin.com/wp-content/uploads/2020/06/LUIS-Authoring-Service-for-Bot-Framework-Composer.png" alt="LUIS Authoring Keys and Endpoint for Bot Framework Composer" width="1018" height="537" />
<h3>Web App / Azure Function</h3>
If you want to publish your bot to the Web App and if it's already created, you just have to provide its name in <strong>hostname.</strong> I have not tried with Function but I am quite sure that it'd be the same configuration.

<img class="aligncenter size-full wp-image-30941" src="https://www.arafattehsin.com/wp-content/uploads/2020/06/AppService-Bot-Framework-Composer.png" alt="App Service for Bot Framework Composer" width="697" height="504" />
<h3>App</h3>
In order to get the Microsoft App ID and Password, just go to your Bot Channels Registration, go to Settings, click on the Manage and then you can create another key by going to the Certificates and secrets section.

<img class="aligncenter size-full wp-image-30942" src="https://www.arafattehsin.com/wp-content/uploads/2020/06/AppID-and-Password-for-Bot-Framework-Composer.png" alt="Microsoft App ID and Password for Bot Framework Composer" width="582" height="661" />

&nbsp;
<blockquote>The only section I did not cover was about blob as my bot does not use that. However, I am sure you won't get stuck after reading all this. Still if you think you are not able to do that, please let me know and I'll be glad to help you out.</blockquote>
&nbsp;

Now as everything is covered! Try to replace all the values in the JSON I posted above and then publish it to see the output. I'm very much hopeful that you're going to see a success in your Composer.

<img class="aligncenter size-full wp-image-30945" src="https://www.arafattehsin.com/wp-content/uploads/2020/06/Publish.png" alt="Publish Bot Framework Composer Bot" width="1183" height="570" />

&nbsp;

The Bot Framework Engineering team is working hard to bring great experience for the people like you who are very much interested in building awesome bots. If you think some feature is not working or missing - you can always request for this on their <a href="https://github.com/microsoft/BotFramework-Composer/issues">GitHub repo</a> and you will hopefully see the response. I hope this guide helps you in publishing right from the client now 💯

Until next time.