Git Product home page Git Product logo

meraki-api-demo's Introduction

Meraki API demo platform

Architecture diagram


How to run this Meraki API demo

In Webex Teams, chat with MerakiBot at [email protected]

Ask for an “API demo” and have some fun!


Part A: Setup Webex Teams chatbot

  1. Go to the Cisco Webex for Developers site and login with your credentials. If you’re new to Webex Teams, you’ll need to create an account first.

  1. Click on your avatar upper-right > “My Webex Teams Apps”, then “Create a New App”.

  2. Click on “Create a Bot”.

  3. Give your bot a name and username (which will be its @webex.bot address), along with description. Optionally, choose an icon, which needs to be exactly 512 x 512 pixels, to use from websites like Flaticon.

  1. Once created, copy the “Bot’s Access Token” and save it for later.

Part B: Create Cloud Function to react to messages and card submissions

  1. Login to the GCP console dashboard, and create a new project if needed.

Find “Cloud Functions” from the left-hand menu (pin it for easier access to the top), and then click “Enable API” in the middle of the page.

  1. Download and navigate to the chatbot directory, then within it zip up all the contents.

  2. Click “Create function” back in Cloud Functions.

  1. Name your function chatbot, change “Source code” to ZIP upload, “Runtime” to Python 3.7, and select your ZIP file. Choose a “Stage bucket” (create one with default settings if needed) to store the file, and change “Function to execute” to handler. Also, click on “More” and select the “Region” closest to you, then “Create”.

  1. Click on the newly-created chatbot function.

  1. Then the “Trigger” tab.

  1. Copy the URL listed at the bottom. You’ll now go back to your chatbot and setup a webhook to POST to this link address, so that when a message or card submission is received by the bot, Webex Teams will send it over for processing in GCP.

Part C: Connecting Webex Teams with Google Cloud Function

  1. Ensure you’re logged in while on the Webex Developers Create a Webhook page on the upper-right.

  2. For the “Body” section on the right, enter in chatbot for name, messages for resource, created for event, and copy in the invoke URL from the last step of the previous document for targetUrl. See screenshot below for a full example.

  3. Also, for the “Header Authorization” section, disable “Use personal access token”, and copy in your bot’s access token.

  1. After completing these fields, click “Run” and verify that the response returned (scroll down if needed) is 200 OK.

  2. For card submissions, go through the same steps and create a second webhook, except with attachmentActions for resources.

  3. In case multiple webhooks were added by accident, you can check the full list of webhooks associated with your bot by querying with the token here. You only need/want a single active webhook each for messages and attachmentActions, because your bot will forward each webhook separately to your cloud for processing, so if you have multiple webhooks, a single message or card submission may receive multiple replies. If you run into that issue, delete your extraneous webhooks.

  4. At this point, go to Webex Teams and chat with your bot! You can do that clicking the “+” sign > “Contact a Person” > enter in your bot’s @webex.bot username address.

Part D: Meraki dashboard webhooks & web app UI

  1. Similar to the Cloud Function processing Webex events, the dashboard directory contains the logic for processing Meraki dashboard webhooks.

Using the GCloud SDK, you can deploy the function by running:

gcloud functions deploy dashboard --region=us-east4 --source=[PATH_TO_DASHBOARD_SOURCE]
  1. The web app offers an alternative UI to the chatbot, and source within web_ui directory contains the Docker container that is deployed on-demand by Google Cloud Run.

Using the GCloud SDK, you can deploy to Google's Container Registry to be used by Cloud Run by running:

gcloud builds submit --tag gcr.io/[PROJECT_ID]/web_ui

Part E: Explanation on environment variables

The following lists all environment variables deployed with the Google Cloud Functions.

For chatbot function:

  • SERVICE_ACCOUNT_FILE > name of GCP service account's JSON file included in the function
  • BUCKET_ID > name of Firestore object storage bucket
  • SCOPES > "https://www.googleapis.com/auth/cloud-platform"
  • PROJECT_ID > your GCP project ID
  • API_KEY > GCP API key generated for service account
  • SEARCH_ID > cx identifier of custom search engine
  • NAMESPACE > namespace for Google Cloud Run
  • SANDBOX_KEY > Meraki sandbox dashboard API Key
  • SANDBOX_ORG > Meraki sandbox dashboard org ID
  • RUN_DOMAIN > unique domain generated by Google Cloud Run for your project/region, for example "-abcdefghij-uc.a.run.app/"
  • PLIVO_AUTH_ID > authentication ID for Plivo's SMS API
  • PLIVO_AUTH_TOKEN > authentication token for Plivo account
  • PLIVO_PHONE_NUMBER > phone number for Plivo account
  • MERAKI_DEMO_API_KEY > Meraki dashboard API key for creating new orgs
  • BOT_TOKEN > Webex Teams chatbot token
  • BOT_EMAIL > Webex Teams chatbot email

For dashboard webhooks function:

  • PROJECT_ID > your GCP project ID
  • COLLECTION_ID > name of Firestore object storage bucket
  • BOT_TOKEN > Webex Teams chatbot token

meraki-api-demo's People

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.