⚠️ Note: The Google Hangouts Chat API does not allow you to receive files uploaded by your respondents during a conversation.

1) Create a Google project

First of all, make sure you have the rights to create projects on Google Developers console.

Google's documentation provides a link that allows the automatic creation of a project pre-configured for the use we're going to make of it (i.e. a Hangouts Chat bot). So go here. You should see a page like this one :

Click on the "Enable the API" button. A small pop-up window will appear, then after a short or long loading time, you should see this :

Click on the only field present on this window (the one that proposes "Select or create a project"); the interface changes and offers you a first choice "+ Create a new project" which is the one you have to choose.

The window now asks you to enter the name of your project. Execute and click on "Next". After a loading time of several seconds, you should see the following message :

Click on the "Download private key as JSON" button to download the file containing the authentication elements of your project which will be useful later.click on the "Done" button which appeared at the bottom right of the window.

2) Make your project a chatbot Hangouts Chat

a) Access your Google Project Dashboard

You now need to set up your freshly created Google project as a Hangouts Chatbot. Go to this address. You'll then be taken to the Google Developer Console.

⚠️ First, make sure the page you see is for the project you just created. To do this, look at the header banner on the page:

If the red framed area in the screenshot above does show the name of the project you created in the previous step, all is well and you can go directly to the part "b) Configure your Google project", otherwise you have to select your project. To do so, click on the area framed in red on the previous capture. A window like this one will appear, showing you all your Google projects.

First make sure that the selected organization is the right one (selector framed in the top center on the above capture). Next, search for your project in the selected tab "Recent Projects". If you can't find it here, then select the "All" tab at the top of the project list. If necessary, click on the name of your organization to see all the projects attached to it; select your project here. The dashboard of your project will then be displayed.

b) Configure your Google project

You're looking at the dashboard of your Google project. In the main section, at the bottom, you see a table showing the APIs used by your project. In your case, your project uses only one API: Hangouts Chat API. Click this item to display the dedicated configuration section.


The interface changes slightly and you will see the "Configuration" entry in the left-hand side menu in the last position. Click it to be able to change the chatbot settings for your Google project. Fill in the "Application information" fields, i.e. the name, avatar URL and description of your bot.

In the "Features" section, check "The bot works in private messages".

In the "Connection Settings" section, select "Bot URL". A new field "Bot URL" appears in which you must enter the following value:

https://developers.vizir.co/hangouts/messages

In the "Permissions" section, unless you want to define precisely who has the right to install this bot in your organization, you can select "Everyone in ...".

In the end, the page should look like this:

Then click on "Save" to save these settings.

c) Retrieve your project number

You now need to retrieve the identifier of your Google project (you will need it later, when configuring your Vizir bot). Go to this page, make sure that the project selected (in the top banner) is the right one (otherwise follow the instructions given in a) to select it) and note the "Project number".


There you go, your Google project is set up to act like a Vizier chatbot! 👍

3) Configure your Vizir chatbot to connect it to your Google Hangouts Chat project


Now that your Google project is ready, all you have to do is set up your Vizir bot so that the two can communicate.

Go to the dashboard of the Vizir application that you want to display on Google Hangouts Chat, and click on "Share" in the side menu.

Scroll down the page to "Google Hangouts" and click on the icon ✏️ next to it.

Fill in the fields which then appear as follows:

  • APPID : the project number you retrieved in the previous step
  • APP SECRET : paste the full contents of the file you uploaded at the very beginning of the process (part 1) )

🚨 And finally, don't forget to publish these last modifications so that they are taken into account.

👏 Everything is now ready to be tested!👏

4) Install and converse with the bot on Hangouts Chat

Open the Google Hangouts Chat web application. In the left panel, click on the "+" sign next to the "Bots" section:

On the page that appears, there is a search field (at the top) where you can start typing the name of your bot. Once it appears in the suggested results, click on it.

The presentation page of your bot is then displayed. Click on the button "Message" to be able to converse in "direct message" with the bot.

And tadam! Your bot starts the conversation! 🥳


🥳 Bonus : when a respondent chats with your bot via Hangouts, you have access to the user's Hangouts information, the main ones being :

  • displayName : the name of the respondent as displayed in the chat; by default this is the first and last name, e.g. "John Doe".
  • email: the respondent's Gmail/GSuite email, e.g. john@blablacorp.com
  • avatarUrl : the url of the image the user is using on Hangouts Chat

Which means you can use those attributes, for example to greet the user with a greeting resource that says, "Hello {{displayName}}, how can I help you!"

(you also have access to the attributes: name, domainId and mail type will certainly be less useful to you; in any case you will find more information about them in the Google documentation)

Did this answer your question?