Is there a way to use the authentication retrieved from Microsoft Teams (via TeamsFX) and use it for an internal web API? about teams-toolkit HOT 5 CLOSED

As suggested, adding in the getSsoToken function made all the difference and now I can query my API with no issues! :)

@JerryYangKai and @blackchoey thank you both for the great help! 🚀 🚀

from teams-toolkit.

Hi @FredTheDane , can you share how do you get the authentication token retrieved from Teams inside the tab you mentioned? By the way, does the internal Web API mean an API implemented in same project as your tab app? Or it means another web API project?
By default, the TeamsFx extension configured the web api to accept token got from Teams Tab single sign-on feature (you can use TeamsUserCredential to get such a token). You can find related configuration code at https://github.com/OfficeDev/TeamsFx/blob/dev/packages/simpleauth/src/TeamsFxSimpleAuth/SimpleAuthWebApiExtension.cs#L39-L55

from teams-toolkit.

Hi @blackchoey :)

The way that I try and use the Teams Authentication token is something along the lines of this inside the OnAfterRenderAsync method of the tab.razor file (The application is pretty much as is with what you get using the Microsoft Teams App project template:

            var token = await teamsfx.GetAuthenticationToken();
            WebClient.DefaultRequestHeaders.Add("Authorization", "Bearer " + token.Token);
            var value = await WebClient.GetAsync("https://localhost:44357/api/Diagram");

The Diagram api is just a quick and dirty API controller that spits out an array within the same project as the tab app. However, when checking the value I get this Unauthorized error back: {Bearer error="invalid_token", error_description="The signature is invalid"}

When you say that I can use TeamUserCredential to get a token, where would I need to implement this in the JwtBearerOptions and how would I get the token?

from teams-toolkit.

Thank you @FredTheDane for the details. The project created by Teams Toolkit extension wraps the TeamsUserCredential to acquire token. @JerryYangKai will provide more instructions on how to update the code to call the internal web APIs.

from teams-toolkit.

Hi @FredTheDane, since we only got JavaScript version of microsoft/teamsfx sdk, so we including webpack to wrapper it and using JSRuntime to trigger it in Blazor.
The webpack source code is in JS/src/index.js, you could add these code to get SSO token

export async function getSsoToken() {
var credential = new TeamsUserCredential();
var token = await credential.getToken("");
return token;
}

Then under JS folder , run 'npm install' and 'npm run build' to webpack the code and refresh the webpack file (wwwroot/teamsfx.js).
Finally you could using JSRuntime trigger the new func you just added in TeamsFx.cs.
await jsRuntime.InvokeAsync<AccessToken>("TeamsFx.getSsoToken");
We've tried to remove webpack and provide a more convenient way to using sdk in the future.

from teams-toolkit.