microsoft / BotBuilder-Samples

Welcome to the Bot Framework samples repository. Here you will find task-focused samples in C#, JavaScript/TypeScript, and Python to help you get started with the Bot Framework SDK!
https://github.com/Microsoft/botframework
MIT License
4.37k stars 4.87k forks source link

501 from bot-authentication sample in MS Teams app but works on "Test in Web Chat" #2072

Closed mattcobb closed 4 years ago

mattcobb commented 4 years ago

Sample information

  1. Sample type: javascript_nodejs
  2. Sample language: nodejs
  3. Sample name: 18.bot-authentication

Describe the bug

Authentication to Okta OAuth2 works fine through the Azure portal "Test in Web Chat". When used from MS Teams app, the bot sets a 501 in botFrameworkAdapter.js:748 . InvokeResponse is undefined so it sets 501.

To Reproduce

Steps to reproduce the behavior:

  1. clone the samples
  2. Open nodejs 18.bot-authentication sample folder in VS Code
  3. npm install botbuilder, botbuilder-dialogs, restify and dotenv
  4. In Azure portal create the bot, get app id and secret, set my ngrok as the endpoint, create an OAuth2 connection to my OKTA account
  5. Test Connection - login works
  6. Add app id, app password, and connection name to sample .env
  7. Go thru the AppStudio wizard, set the .botframework.com, .*.botframework.com, and oauth domain as valid domains
  8. Install bot to my Team and a channel
  9. Back on the Azure portal, use Test in Web Chat
  10. The bot starts fine and give the Welcome message
  11. I type something, it provides the Sign In button, I click it and get redirected to OKTA for login. That goes ok and I get a page with a Verification Code and a copy button. I type the verification code into Test Chat and I'm signed in. I can view the Access Token. Took that token to jwt.io validated the iss is my OKTA IdP.
  12. Next try this in MS Team app (on mac). I type something in the channel where the bot is attached and get the Sign In button (1st screen shot), I click it and get a browser popup directed to OKTA (2nd & 3rd screen shots) and I login.
  13. The popped up browser window goes away - no verification code page. Instead, the bot is invoked, gets down into processActivity() in botFrameworkAdapter.js:748 . InvokeResponse is undefined so that func sets http status to 501 which gets thrown: (node:26701) UnhandledPromiseRejectionWarning: Error: BotFrameworkAdapter.processActivity(): 501 ERROR at BotFrameworkAdapter. (/Users/mcobb/src/messaging-channels/msbot/node_modules/botbuilder/src/botFrameworkAdapter.ts:769:23) at Generator.next () at fulfilled (/Users/mcobb/src/messaging-channels/msbot/node_modules/botbuilder/lib/botFrameworkAdapter.js:11:58) at process._tickCallback (internal/process/next_tick.js:68:7)

Do I miss some setup for this to work in MS Team App. I get the same behaviour at teams.microsoft.com. Only Test Web Chat completes the login from the Azure portal.

Expected behavior

At step 13 above, I expect to be logged in and have access to the OAuth Access Token available.

Screenshots

signin-button-teamsapp oauthusernamepage oauthpwdpage

[bug]

mattcobb commented 4 years ago

My copy of the sample attached, minus my bot password and the node_modules dir: 18.bot-authentication.zip

jwiley84 commented 4 years ago

Hi @mattcobb!

Sample 18 is not the best choice if you're looking for an example of how to set up OAuth in Teams. We have Sample 46. Teams-Auth that was designed around correcting the problem you describe.

In particular: the Oauth card sends an Invoke Activity to the bot, instead of the Event Activity used in every other channel. This Invoke Activity must be forwarded to the dialog, but doesn't if you're using the standard ActivityHandler.

Sample 46 does this by extending TeamsActivityHandler instead, from botbuilder in the DialogBot class. In sample 18, DialogBot only extends the standard ActivityHandler.

Please give sample 46 a look over, and if you have further questions concerning bots, samples, bot oauth or integrating a bot with Teams, please feel free to open a new issue.

mattcobb commented 4 years ago

Thanks for looking into that. I tried the other sample and it works fine. It also works in "Test in WebChat"

jelleholtkamp commented 5 months ago

Hi @mattcobb!

Sample 18 is not the best choice if you're looking for an example of how to set up OAuth in Teams. We have Sample 46. Teams-Auth that was designed around correcting the problem you describe.

In particular: the Oauth card sends an Invoke Activity to the bot, instead of the Event Activity used in every other channel. This Invoke Activity must be forwarded to the dialog, but doesn't if you're using the standard ActivityHandler.

Sample 46 does this by extending TeamsActivityHandler instead, from botbuilder in the DialogBot class. In sample 18, DialogBot only extends the standard ActivityHandler.

Please give sample 46 a look over, and if you have further questions concerning bots, samples, bot oauth or integrating a bot with Teams, please feel free to open a new issue.

The link you provided is dead. I'm running into the same issue, except i'm using the python code sample from here, as pointed out in the Add authentication to your Teams bot documentation. Could you point me to the right Python code sample for Teams bot authentication?

jelleholtkamp commented 5 months ago

I found a working sample in the archive folder. It would seem the solution @jwiley84 mentions is not present in the code sample linked on the official MS documentation page.