I've built a Teams app with a notification bot that uses adaptive cards. The interaction with the adaptive card works perfectly in my local environment:
1-I receive the card in teams.
2-I interact with the card successfully.
3-The card gets refreshed with the new one.
However, when the solution is deployed in the azure app services(Windows OS), it fails in step 3 and the card doesn't get refreshed and shows a message saying Something went wrong. Please try again.
.
Here is the relevant code(I to focus in onAdaptiveCardInvoke
event):
const { TeamsActivityHandler, StatusCodes, MessageFactory, CardFactory, ActivityTypes } = require("botbuilder");
const { updateInstanceState } = require("./merlinOperations");
const { successInteractionStatusChange } = require('./adaptiveCards/templates');
const { InvokeResponseFactory } = require("@microsoft/teamsfx");
const { HttpStatusCode } = require("axios");
const { AdaptiveCard } = require("@microsoft/adaptivecards-tools");
// An empty teams activity handler.
// You can add your customization code here to extend your bot logic if needed.
class TeamsBot extends TeamsActivityHandler {
constructor() {
super();
this.onMessage(async (context, next) => {
if (context.activity.name === "adaptiveCard/action") {
let invokeResponse = await this.onInvokeActivity(context);
await context.sendActivity({
type: ActivityTypes.InvokeResponse,
value: invokeResponse,
});
}
else {
await context.sendActivity("Este bot es solo para generar notificaciones desde merlin");
}
//This next calls the next event(Middleware) in case we have many of them.
await next();
});
}
async onAdaptiveCardInvoke(context) {
try {
//Here we confirm the interaction came from an adaptive card
if (context.activity.name === "adaptiveCard/action") {
//Internal logic that returns the refreshed card.
let invokeResponse = InvokeResponseFactory.adaptiveCard(successInteractionStatusChange);
invokeResponse.statusCode = StatusCodes.OK;
await context.sendActivity({
type: ActivityTypes.InvokeResponse,
value: invokeResponse,
});
return invokeResponse;
}
} catch (error) {
//If there was any error we go ahead an throw a toaster with saying an erro has occured
console.info("###ERROR ocurrió en el invoke ", error)
const cardRes = {
statusCode: StatusCodes.OK,
type: 'application/vnd.microsoft.error',
value: { message: `ha ocurrido un error ${error.message}` }
};
const res = {
status: StatusCodes.OK,
body: cardRes
};
return res;
}
};
}
module.exports.TeamsBot = TeamsBot;
Any insights on why the interaction works locally but fails in Azure would be appreciated.
Here is the post in StackOverflow:
https://stackoverflow.com/questions/78513742/adaptive-card-works-locally-but-fails-when-deployed-in-azure