How to embedded Microsoft Bot Emulator on my website - botframework

I'm trying to have the bot emulator running on my website, so the user can add cards & contact and test it from the website.

The Emulator is built on the WebChat application/source code. WebChat is a directline client for the directline channel. The emulator is used for development and testing. You can use webchat as a way to test, but you're not going to get some of the tools/benefits you get from Emulator. You might be able to take the emulator source code and build what you need, but that seems like a lot of work for so little benefit.
Your bot code does not have to be hosted in Azure, but for the simplest setup, you should create a bot channels registration in Azure and use that. Configure that to set your endpoint to wherever your bot code is running and then use the webchat channel and client.

Related

Teams communication to custom https endoint

I would like to know how does Team communicate with a custom https endpoint.
I am developping a bot using Teams Toolkit and I am trying to understand what commands does teamsfx in order to successfuly side load app on Teams.
When trying to run the default command of "dev:teamsfx" and building the package using the correct ngrok enpoint and then uploading that package on Teams, the bot does not receive any messages through the "api/messages" endpoint.
However, when i run the deugging tool in VS Code, everything works fine and we pin pointed that the part that we are missing to add is found inside of these commands :
Teams Toolkit executed commands
So i have 2 questions :
Where can i find documentation regarding the tasks that Teams Toolkit is running so that we can manually execute those commands?
Why does Teams not reach our "api/messages" endpoint when we ONLY run "dev:teamsfx" ? (The appPackage is correct with the right manifest)
To answer your two questions:
The documentation about using Teams Toolkit to debug you app is here. You can read the documentation to know the details about what Teams Toolkit does for you after you press F5. For bot, Teams Toolkit will register and configure the bot, see here for more details.
When you run dev:teamsfx, the bot service will start. However, you have not configured the bot messaging endpoint, this is why Teams does not reach api/messages. When you press F5, Teams Toolkit will automatically start ngrok to forward the local bot traffic to a public url, then use this url to configure the bot messaging endpoint, e.g. https://0556-2404-f801-9000-1a-6fea-00-690.ngrok.io/api/messages. If you want to use your own tunnelling tool instead of the default ngrok, you can follow this doc. By the way, you can manage the bot (that Teams Toolkit has created for you) in Bot Framework developer portal, https://dev.botframework.com/bots.

Chat Bot is not working - HTTPS internal server error

I have created a sample Echo bot for testing i've followed the given instructions in the MS tutorial site.
Created a web app service
Downloaded the MS bot framework v4 SDK - Echo Bot
Got the Publishing profile
Published the bot using visual studio
tested the chat bot When i test my bot in Test in Web Chat option in bot channels registration.
before that i tested in bot framework emulator, it was working fine as expected.
I checked the microsoft appid and password, it is all fine.
what am i missing to look on. can anyone please guide me.
Finally I've found the issue, though it a minor mistake. I wanted to update it here since many new Azure Bot users might do this mistake like me.
It was due to the option which i selected in while doing the app registration, After selecting the third option for Who can use this application or access this API?
It always good to select Multitenant option to make the bot to work for everyone.
If your requirement is restricted to one particular tenant then you should select the first option. But it is not in my case.
Accounts in any organizational directory (Any Azure AD directory -
Multitenant) and personal Microsoft accounts (e.g. Skype, Xbox)

Is there any way to develop own Webchat instead of Microsoft Botframework-Webchat

I don't want to keep any dependency on Microsoft Botframework registration for Webchat. I have successfully deployed my Bot Code in Shared Server instead of AzurePortal, But to use the Webchat I have to register the Bot in AzurePortal.
My concern is to develop own Webchat which will directly communicate with the Bot API Endpoint.
Have anyone work on this situations.
To clarify, bots communicate via:
User interaction with DirectLine Client ->
DirectLine API receives data and sends to bot ->
Bot hosted anywhere receives message
WebChat is just a DirectLine client. If you want to build your own WebChat, you can clone the repo and build it yourself. Note, however, that all this does is make it so you can host your own webchat.js file.
I believe that what you're actually looking for is to build your own DirectLine API. The only way to do so, currently, is to develop it in Node with the offline-directline npm package. This is not an official Bot Framework package, but will accomplish what you need. To then use WebChat with offline-directline, you would just need to change domain property when rendering WebChat.

How do I set up a bot for testing and a bot for production?

I've been tasked with making a bot that is supported on both web and MS Teams. I am thankful for the bot emulator, but it's not the same as a web UI or when using MS Teams. So if my bot works in the emulator, it means very little since it sometimes has different results in the web ui or in MS Teams.
If I want to test the web UI, I cannot do this on my localhost environment. Same with MS Teams. The localhost environment is only good for the bot emulator as far as I know.
Someone recommended me to use ngrok. Then I would go to my Web App Bot in Azure and type my ngrok URL. Then MS Teams and the web UI make requests to ngrok, which makes requests to my localhost, and I can debug very easily.
However, the only way I could do that was to go into my production bot and change the URL (see next image). This means all the users using the bot would now be making requests to my ngrok localhost bot, which I don't want to happen.
I was thinking about setting up two chat bots. But then I get confused because if I make a second bot, and I change that bot's url with my localhost bot on ngrok (like in the picture), would that work? This new "testing" bot would have a different app id and password.
Or maybe I should do something else?
Found the answer. It is to create a bot channels registration, which lets you edit the settings without editing the production bot.
See here:
https://learn.microsoft.com/en-us/azure/bot-service/bot-service-debug-inspection-middleware?view=azure-bot-service-4.0&tabs=csharp#inspect-the-state-of-a-bot-configured-in-azure

Custom bot not working with mobile client

I have a Custom Bot set up via using these instructions.
The Bot is set up and successfully working in a Team when it is #Mentioned from a Teams desktop client or the web interface. When the Bot is #Mentioned from a Teams mobile client however, it does not respond.
I added logging to my webhook and have found that it does not seem to be triggered when #Mentions from a mobile client are sent.
Is there a bug here or are #Mentions from mobile devices not supported?
Invoking custom bots from mobile devices is not currently supported. I wish we had a good reason, but we don't; it fell through the cracks. Thanks for bringing it to our attention and reminding us about it.
We don't have an ETA for when it will be supported, but we do intend to support it.

Resources