How to add my MS Bot app in my own Asp.Net web application

Question

enter image description hereI have created the MS Bot application using C# with LUIS for Intents recognizing. I want to add the chat UI in my own sample Asp.Net web application. I've not used Azure services, simply i have used user Intents recognizing for LUIS service and developed the MS Bot with C#. How to integrate or give new UI for Chat bot using my own web application.

looks like you've made a desktop UI for it, so you'd need to replace the desktop UI with a web-based UI, but use the same functionality underneath. — ADyson, Jan 04 '18 at 07:32
Yeah @ADyson you are right it was in the desktop UI but i want convert in to web-based UI. how do i deploy this application in to web application like Asp.net page. That s wat the thing im searching for. — Vaasir Nisaar, Jan 04 '18 at 07:54
It looks (looking more closely at your screenshot) because it has a URL and web.config, that this is a self-contained web app already? And you just run it inside some sort of emulator? Basically you have got a Web API controller there, and a HTML page which probably contains ajax calls to the API. So you can just move that HTML/ajax into your asp.net app, and use it call the bot API - you can deploy that as a separate endpoint. — ADyson, Jan 04 '18 at 08:21
@ADyson im having WebApiConfig.cs file in that Json setting, WebAPI configuration and services were given and Im having main class as Message controller from that only my it will start trigger — Vaasir Nisaar, Jan 04 '18 at 09:30

score 2 · Answer 1 · edited Jan 04 '18 at 10:35

2

Here you can see the Message controller which is startign point of the Application from here only it starts. here only we are sending and receiving the responses of a user.

edited Jan 04 '18 at 10:35

Akos Nagy

4,201
1
20
37

answered Jan 04 '18 at 10:05

Vaasir Nisaar

51
1
9

score 1 · Answer 2 · answered Jan 05 '18 at 06:55

You can separately develop your bot application and your asp.net application. And to embed your bot into your web application, you can use Direct Line API.

For example, after publishing your bot, you can Connect a bot to Direct Line, the easy way is to use IFRAME in your web pages for example:

<iframe src='path to your bot with SECRET key or token' height="height" width="width"></iframe>

For more information, you can refer to ReadMe of Microsoft Bot Framework Web Chat.

Eric Dahlvang · Answer 3 · 2019-03-07T21:45:35.720

Option 1: hosted webchat

Be sure to exchange the direct line secret for a token before returning the page to the user. The secret should never be shared. More information can be found here: https://learn.microsoft.com/en-us/azure/bot-service/rest-api/bot-framework-rest-direct-line-3-0-authentication

<!DOCTYPE html>
<html>
  <body>
    <div id="webchat" role="main"></div>
    <script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
    <script>
      window.WebChat.renderWebChat({
        directLine: window.WebChat.createDirectLine({ token: 'YOUR_DIRECT_LINE_TOKEN' }),
        userID: 'YOUR_USER_ID',
        username: 'Web Chat User',
        locale: 'en-US',
        botAvatarInitials: 'WC',
        userAvatarInitials: 'WW'
      }, document.getElementById('webchat'));
    </script>
  </body>
</html>

Option 2: iframe

Once you've registered a Bot Service in Azure, the easiest way is to add the iframe embed code to the <body> in the default.htm file created by the Bot Application template:

<body>
   <iframe src='https://webchat.botframework.com/embed/YOUR_BOT_HANDLE?t=YOUR_WEBCHAT_TOKEN' height="400" width="400"></iframe>
</body>

Be sure to change YOUR_BOT_HANDLE and YOUR_WEBCHAT_TOKEN to match your own.

Then, when you run the project, the page that is displayed will show the webchat control connected to your bot.

I think using of iframe having the drawback of getting the secrets easily by inspecting. So why don't you go with the API for this ? — Jayendran, Mar 07 '19 at 10:26

How to add my MS Bot app in my own Asp.Net web application

3 Answers3

Linked