Skip to main content

Notifications

Publish & Channel Management
Unanswered

How to keep the Bot_ID secure

Posted on by 24

If I use the BOT_ID in the code below, how do I make sure this does not fall into the wrong hands? Couldn't somebody see my BOT_ID by inspecting the element?

 

 

<!DOCTYPE html>
<html>
<head>
 <title>TEST CHAT BOT</title> 
 <!-- This styling is for the Web Chat demonstration purposes. It is recommended that style is moved to separate file for organization in larger projects -->
 <style>
 html, body {
 height: 100%;
 }

 body {
 margin: 0;
 }

 h1 {
 font-size: 24px;
 font-family: Source Sans Pro Bold 700;
 line-height: 20px;
 color: whitesmoke;
 display: table-cell;
 padding: 13px 0px 0px 20px;
 }

 #heading {
 background-color: #FFFFFF;
 height: 50px;
 }

 .main {
 margin: 18px;
 border-radius: 4px;
 }

 div[role="form"]{
 background-color: #FFFFFF;
 }

 #webchat {
 position: fixed;
 height: calc(100% - 50px);
 width: 100%;
 top: 50px;
 overflow: hidden;
 }

 </style>

</head>
<body>
 <div>
 <div id="heading">
 <!-- Change the h1 text to change the bot name --> 
 <h1></h1>
 </div>
 <div id="webchat" role="main"></div>
 </div> 

 <script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>

 <script>

 const styleOptions = {
 
 // Add styleOptions to customize Web Chat canvas - hide upload button
 hideUploadButton: true,
 
 // Primary font
 primaryFont: "Source Sans Pro",
 userAvatarInitials: "ME",
 userAvatarBackgroundColor: "Grey",
 
		 // Change bubble from BOT
 bubbleTextColor: "#FFFFFF",
 bubbleBackground: "#007D85",
		 bubbleBorderRadius: 10,
 
 bubbleBorderColor: "#FFFFFF",
 
		 
 // Change bubble from USER
 bubbleFromUserBackground: "#EDEDED",
 bubbleFromUserTextColor: "#000000",
 bubbleFromUserBorderRadius: 10,
 bubbleFromUserBorderColor: "#EDEDED",
 
 
 
 
 // Add avatar images and user avatar images and BG color for BOT
 botAvatarInitials: 'BT',
 accent: '#00809d',
 botAvatarBackgroundColor: "#FFFFFF",
 botAvatarImage: 'https://docs.microsoft.com/en-us/azure/bot-service/v4sdk/media/logo_bot.svg',
 
 //Change the suggested action layout buttons
 suggestedActionLayout: 'carousel',
 suggestedActionBorderRadius: 10,	 
 suggestedActionBackgroundColorOnHover: '#007D85',
 suggestedActionTextColorOnHover: '#FFFFFF',
 };

 // Add your BOT ID below 
 var BOT_ID = "<<BOT_ID>>"; 
 var theURL = "https://gcc.api.powerva.microsoft.us/api/botmanagement/v1/directline/directlinetoken?botId=" + BOT_ID;
 
 const store = window.WebChat.createStore(
 {},
 ({ dispatch }) => next => action => {
 if (action.type === "DIRECT_LINE/CONNECT_FULFILLED") {
 dispatch({
 meta: {
 method: "keyboard",
 },
 payload: {
 activity: {
 channelData: {
 postBack: true,
 },
 //Web Chat will show the 'Greeting' System Topic message which has a trigger-phrase 'hello'
 name: 'startConversation',
 type: "event"
 },
 },
 type: "DIRECT_LINE/POST_ACTIVITY",
 });
 }
 return next(action);
 }
 );
 fetch(theURL)
 .then(response => response.json())
 .then(conversationInfo => {
 window.WebChat.renderWebChat(
 {
 directLine: window.WebChat.createDirectLine({
 token: conversationInfo.token,
 }),
 store: store,
 styleOptions: styleOptions
 },
 document.getElementById('webchat')
 );
 })
 .catch(err => console.error("An error occurred: " + err));

 </script>
 </body>
</html>

 

  • jdriscollpro Profile Picture
    jdriscollpro 24 on at
    Re: How to keep the Bot_ID secure

    Thanks so much @PowerPuffKK . Definitely helps! One last thing though, once I enforce web channel security what code snippet in what I attached do I replace for the BOT ID? 

  • PowerPuffKK Profile Picture
    PowerPuffKK 325 on at
    Re: How to keep the Bot_ID secure

    Hi again @jdriscollpro  😊

     

    You are indeed correct - if you post the chatbot as is with the BOT ID visible on your website, anyone could grab it using the Inspect Element feature and then use it for their bot.

     

    To prevent this, you will need to enforce web channel security and use tokens that could be static or refreshed/regenerated depending on your needs. Here's the link to the documentation and how to configure it - it's easier than it sounds. https://docs.microsoft.com/en-us/power-virtual-agents/configure-web-security

     

    If this answer helps you, please mark it as a solution for future forum visitors.

     

    Kristine 😊

  • jdriscollpro Profile Picture
    jdriscollpro 24 on at
    Re: How to keep the Bot_ID secure

    @SupportBryn Wouldn't somebody be able to put our chatbot on their website if they have the bot ID? 

  • SupportBryn Profile Picture
    SupportBryn on at
    Re: How to keep the Bot_ID secure

    Hey there @jdriscollpro,

     

    Is there a particular reason you are concerned about users grabbing your BOT_ID? That by itself should not give them anything in the way of meaningful information, unless you are using it elsewhere as the key to something.

     

    Thank you for using Microsoft Power Platform Communities!
    Bryn Baker
    Support Engineer
    Microsoft Power Platform
    If this post helps, then please consider accepting it as the solution to help other members find it more quickly! Have a great day!

Helpful resources

Quick Links

Welcome to the Power Platform…

We are thrilled to unveil the newly-launched Power Platform Communities!…

Getting Started…

Welcome to the Power Platform Community! We appreciate your visit…

Welcome to the new Power Platform Community!…

We are excited to announce our new Copilot Cookbook Gallery in the Community…

Leaderboard

#1
WarrenBelz Profile Picture

WarrenBelz 138,030

#2
RandyHayes Profile Picture

RandyHayes 76,308

#3
Pstork1 Profile Picture

Pstork1 63,085

Leaderboard

Featured topics