01.browser-echo

browser echo sample

Bot Framework v4 browser bot sample

The example shows the use of the botbuilder-js SDKs for the browser using the BotFramework-WebChat and a custom WebChatAdapter.

To try this sample

• Clone the repository

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

• In a terminal, navigate to samples/javascript_es6/01.browser-echo

  cd samples/javascript_es6/01.browser-echo

• Install modules

  npm install

• Build the sample

  npm run build

• Start the bot

  npm start

• Launch a web browser and navigate to http://localhost:8080.

Adapters

Developers can use the BotAdapter abstract base class to implement their own custom adapters. Implementing a custom adapter allows users to connect bots to channels not supported by the Bot Framework. In this sample, a custom WebChatAdapter has been implemented so that the entirety of the bot is hosted in a user's browser.

Hosting a bot in the browser provides these benefits:

• A bot hosted in the user's browser has improved latency as there is no round-trip from the browser to a server hosting the bot.
• One engineering team in charge of bot design and the website. This can lead towards a more integrated UX and speed up development.
• A browser hosted bot can offload some of the work done by your servers by passing it to the user's machine.

Further reading

• Azure Bot Service
• Activity processing
• Bot State and storage