question

Serban avatar image
0 Votes"
Serban asked PrithviKamble-MSFT-9239 commented

Trying to wrap my head around "Teams Message Extensions" development; need some introductory help...

Hi all,

I need to develop a simple message extensions for Teams (usable in Channel & 1:1Chats) that does a simple thing: when accessed, checks some URL (configured by the teams user when the message extension is first time installed), processes the info and displays the result as a card.

What I sort-of know until now to do: I worked on some other types of Teams Add-ins: custom Teams Tabs developed using SPfx components (basically starting from here https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/using-web-part-as-ms-teams-tab ).

Now I've watched some introductory tutorials from the Microsoft 365 Developer YouTube channel (one, two, three), but I still cannot wrap my head around it, basically I don't know how to start this.

what blocks me: what is it with that ngrok that they use in those tutorials ? Why do I need that ? Isn't the teams bot hosted in Azure, doesn't it run there ?
I was testing & debugging the Teams Addins with SPFx by running deploying a specially built version (for debug purposes) which was getting data from "https://localhost..." , and starting the app with gulp serve .
Is this ngrok procedure a replacement for that ?

Another question can I consider the bot to be a server-side running app ? Do I have the possibilities to store something as a backend-only accessible property, something that would not be safe to store in the front-end ?

Any kind of help, some pointing to initial steps, would help a lot.

Thank you.







office-teams-app-dev
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

PrithviKamble-MSFT-9239 avatar image
0 Votes"
PrithviKamble-MSFT-9239 answered PrithviKamble-MSFT-9239 edited

Hi @Serban,
You can refer below document link and sample codes to get started with building messaging extension in teams.
https://docs.microsoft.com/en-us/microsoftteams/platform/get-started/first-message-extension?tabs=vscode
https://github.com/microsoft/BotBuilder-Samples/tree/main/samples

Also, even though azure bot service is hosted on cloud, the code used to build the bot should be deployed on cloud or be publicly available to handle incoming requests passed by the azure bot service to our app. This can be done by ngrok which locally host's our localhost solution on a publicly accessible URL.


Thanks

5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Serban avatar image
0 Votes"
Serban answered PrithviKamble-MSFT-9239 commented

Hi @PrithviKamble-MSFT-9239 ,

I'll look into the links that you sent.

As for the hosting/ngrok aspect, I still have some questions:
- how would a PROD environment look ? Asides from installing the custom teams app... do I need to host something else in a different premise ?
- is there any alternative to ngrok ? I just realized this might not be so easy in my current network configuration...

Thanks.



· 1
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Hi @serban,
For PROD environment you will have to deploy the code to the app service. You can refer below link :
https://docs.microsoft.com/en-us/azure/app-service/quickstart-dotnetcore?tabs=netcore31&pivots=development-environment-vs

0 Votes 0 ·
Serban avatar image
0 Votes"
Serban answered PrithviKamble-MSFT-9239 commented

But when I deploy my app to production, what happens to whatever was running under ngrok while developing ? Where does that get hosted ?

· 2
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Hi, ngrok is recommended to be used for local development and debugging and not for PROD environment. Also ngrok will just route your local solution running on localhost to a public url which will only work until your solution is running locally. You can just stop the solution running locally or end the ngrok session after your local development is completed and deploy the whole to app service.

0 Votes 0 ·

Hi @Serban,
Did the above solution worked for you ? If yes can you accept the answer.


Thanks

0 Votes 0 ·