如何实现Teams API中Adaptive Card按钮点击触发脚本执行

Got it, let's get those buttons working to run your scripts when clicked! Here's exactly what you need to do, step by step:

1. First, Fix Your Button Configuration #

Right now both your "Yes" and "No" buttons have identical text, displayText, and value—that means you won't be able to tell which one was clicked. Update them to carry unique, meaningful data so your backend can distinguish the action. For example:

"buttons": [
  {
    "type": "messageBack",
    "title": "Yes",
    "text": "Alert approved",
    "displayText": "I approve this alert",
    "value": "{\"action\": \"approve\", \"alert_id\": \"ALERT-001\"}"
  },
  {
    "type": "messageBack",
    "title": "No",
    "text": "Alert rejected",
    "displayText": "I reject this alert",
    "value": "{\"action\": \"reject\", \"alert_id\": \"ALERT-001\"}"
  }
]

• The value field is a JSON string that carries custom data (like the action type and alert ID) to your backend.
• displayText shows up in the chat thread so other users can see the response, and text is the raw message sent to your bot/webhook.

2. Set Up a Backend to Receive Button Clicks #

MessageBack buttons send an event to a backend endpoint when clicked. You have two main options here:

• Microsoft Bot Framework: The most robust way for Teams interactions. It handles authentication, event parsing, and more out of the box.
• Outgoing Webhook: A simpler option if you don't need full bot capabilities, but it has more limitations (like no user context beyond the message).

Example with Bot Framework (Node.js) #

If you're using Node.js, here's a minimal handler that catches the button click and runs your scripts:

const { TeamsActivityHandler } = require('botbuilder');

class AlertHandlerBot extends TeamsActivityHandler {
    async onMessage(context) {
        // Check if the message is from a button click (contains value data)
        if (context.activity.value) {
            try {
                const buttonData = JSON.parse(context.activity.value);
                const { action, alert_id } = buttonData;

                // Run your script based on the action
                switch(action) {
                    case "approve":
                        await this.executeApprovalScript(alert_id);
                        await context.sendActivity(`Approval script ran for alert ${alert_id}!`);
                        break;
                    case "reject":
                        await this.executeRejectionScript(alert_id);
                        await context.sendActivity(`Rejection script ran for alert ${alert_id}!`);
                        break;
                    default:
                        await context.sendActivity("Unknown action received.");
                }
            } catch (err) {
                console.error("Error processing button click:", err);
                await context.sendActivity("Oops, something went wrong running the script.");
            }
        }
        return super.onMessage(context);
    }

    // Replace these with your actual script logic
    async executeApprovalScript(alertId) {
        // Example: Run a shell command, call an API, or execute internal logic
        console.log(`Running approval workflow for alert ${alertId}`);
        // Your code here: require('./scripts/approve.js')(alertId);
    }

    async executeRejectionScript(alertId) {
        console.log(`Running rejection workflow for alert ${alertId}`);
        // Your code here: require('./scripts/reject.js')(alertId);
    }
}

module.exports.AlertHandlerBot = AlertHandlerBot;

3. Deploy & Connect Your Backend to Teams #

• Deploy your backend: You need a public URL so Teams can send events to it. Use tools like ngrok for local testing (run ngrok http 3978 to tunnel your local bot port), or deploy to a cloud service like Azure, AWS, or Heroku.
• Register your bot: Go to the Azure Portal, register a Bot Service, and link it to your Teams channel. Make sure to set your bot's endpoint URL to your deployed endpoint (or ngrok URL for testing).
• Test the flow: Send your Adaptive Card again, click the buttons, and check if your backend receives the event and runs the scripts. You can add logs to debug if something doesn't work.

Key Notes #

• Authentication: If using Bot Framework, Teams automatically authenticates requests, so you don't have to handle extra validation. For outgoing webhooks, you'll need to verify the signature of incoming requests.
• Error Handling: Always wrap your script execution in try/catch blocks so you can notify the user if something fails.
• Script Logic: Your scripts can be anything—shell commands, API calls, internal function executions—just make sure your backend has the permissions to run them.

内容的提问来源于stack exchange，提问作者Gal Interested