Skip to content

Latest commit

 

History

History
 
 

07.using-adaptive-cards

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
bots
bots
 
 
deploymentTemplates
deploymentTemplates
 
 
resources
resources
 
 
.env
.env
 
 
.eslintrc.js
.eslintrc.js
 
 
README.md
README.md
 
 
index.js
index.js
 
 
package.json
package.json
 
 

README.md

Using Adaptive Cards

Bot Framework v4 using adaptive cards bot sample

This bot has been created using Bot Framework, is shows how to send an Adaptive Card from the bot to the user.

Prerequisites

  • Node.js version 16.16.0 or higher

    # determine node version
node --version

To try this sample

  • Clone the repository

    git clone https://github.com/Microsoft/botbuilder-samples.git

  • In a terminal, navigate to samples/javascript_nodejs/07.using-adaptive-cards

    cd samples/javascript_nodejs/07.using-adaptive-cards

  • Install modules

    npm install

  • Start the bot

    npm start

Testing the bot using Bot Framework Emulator

Bot Framework Emulator is a desktop application that allows bot developers to test and debug their bots on localhost or running remotely through a tunnel.

  • Install the latest Bot Framework Emulator from here

Connect to the bot using Bot Framework Emulator

  • Launch Bot Framework Emulator
  • File -> Open Bot
  • Enter a Bot URL of http://localhost:3978/api/messages

Interacting with the bot

Card authors describe their content as a simple JSON object. That content can then be rendered natively inside a host application, automatically adapting to the look and feel of the host. For example, Contoso Bot can author an Adaptive Card through the Bot Framework, and when delivered to Cortana, it will look and feel like a Cortana card. When that same payload is sent to Microsoft Teams, it will look and feel like Microsoft Teams. As more host apps start to support Adaptive Cards, that same payload will automatically light up inside these applications, yet still feel entirely native to the app. Users win because everything feels familiar. Host apps win because they control the user experience. Card authors win because their content gets broader reach without any additional work.

The Bot Framework provides support for Adaptive Cards. See the following to learn more about Adaptive Cards.

Adding media to messages

A message exchange between user and bot can contain media attachments, such as cards, images, video, audio, and files.

Deploy the bot to Azure

To learn more about deploying a bot to Azure, see Deploy your bot to Azure for a complete list of deployment instructions.

Further reading