R1D41 Debugging Webhooks with Flask and Ngrok

| programming | python |

Webhooks are the magic glue that allows you to integrate many different applications together. Essentially a webhook sends a JSON payload of data to some pre-defined endpoint from one system to another.

When webhooks go wrong

While they are great, and usually easy to get started with, it can be a bit tough to debug them when things are not quite working as expected. Recently, there have been some issues with webhooks at CircleCI. There are many different failure modes since there are many different combinations of systems that are possibly involved.

The key questions to ask when debugging webhooks are:

  1. Was it sent?
  2. What did the payload look like?
  3. What payload does the receiving system expect?
I whipped up a dead simple Flask app and hooked up Ngrok for debugging purposes. This allows me to verify that the webhook is sent and also allows me to inspect the payload.

Answering question #3 will be left as an exercise to the reader since there is no way to have a one size fits all answer. This will depend strictly on the receiving system.

Using the Tool

The flask app is about as simple as it can get.
# app.py

from flask import Flask, request import pprint

app = Flask(name)

@app.route(’/’, methods=[‘GET’, ‘POST’]) def index(): if request.method == ‘GET’: return ‘Send me a POST’ else: pprint.pprint(request.json) return ‘Check Console’

This will “pretty print” the JSON payload to console. You can start this up with:

FLASK_APP=app.py && flask run

The app will be running on port 5000 locally. Then you can use ngrok to forward traffic from the internet to any local port on your computer.

Once you have downloaded and installed ngrok you can start it up with:

./ngrok http 5000

This will start up ngrok and start forwarding traffic to your local computer. In the terminal you should see a screen like this:

Ngrok running in a terminal

You can then use the “Forwarding” address anywhere on the web to send requests back to your local computer.

In our specific example, I would add the following section to my config.yml file in CircleCI in order to see the webhooks being sent from CircleCI.

notify:
  webhooks:
    - url: https://a6f2fcd7.ngrok.io

With the app running, I can now receive and inspect webhooks locally in my console.

 * Serving Flask app "app"
 * Running on https://127.0.0.1:5000/ (Press CTRL+C to quit)
{u'payload': {u'all_commit_details': [{u'author_date': u'2018-03-10T10:24:08-08:00',
                                       u'author_email': u'[email protected]',
                                       u'author_login': u'levlaz',
                                       u'author_name': u'Lev Lazinskiy',
                                       u'body': u'',
                                       u'branch': u'webhooks',
                                       u'commit': u'4ee0d32afb7ff5e821593366616a660c9720b70e',
                                       u'commit_url': u'https://github.com/levlaz/sandbox/commit/4ee0d32afb7ff5e821593366616a660c9720b70e',
                                       u'committer_date': u'2018-03-10T10:24:08-08:00',
                                       u'committer_email': u'[email protected]',
                                       u'committer_login': u'levlaz',
                                       u'committer_name': u'Lev Lazinskiy',
                                       u'subject': u'test hooks'}],
              u'author_date': u'2018-03-10T10:24:08-08:00',
              u'author_email': u'[email protected]',
              u'author_name': u'Lev Lazinskiy',
              u'body': u'',
              u'branch': u'webhooks',
              u'build_num': 92,
              u'build_parameters': None,
              u'build_time_millis': 1419,
              u'build_url': u'https://circleci.com/gh/levlaz/sandbox/92',
              u'canceled': False,
              u'canceler': None,
              u'circle_yml': {u'string': u"version: 2\njobs:\n  build:\n    working_directory: ~/sandbox\n    docker:\n      - image: circleci/python\n    steps:\n      - checkout\n      - run:\n          name: Do Nothing\n          command: |\n            echo 'Hello!'\n\nnotify:\n  webhooks:\n    - url: https://7eab6a64.ngrok.io\n"},
              u'committer_date': u'2018-03-10T10:24:08-08:00',
              u'committer_email': u'[email protected]',
              u'committer_name': u'Lev Lazinskiy',
              u'compare': u'https://github.com/levlaz/sandbox/commit/4ee0d32afb7f',
              u'dont_build': None,
              u'fail_reason': None,
              u'failed': False,
              u'has_artifacts': True,
              u'infrastructure_fail': False,
              u'is_first_green_build': False,
              u'job_name': None,
              u'lifecycle': u'finished',
              u'messages': [],
              u'no_dependency_cache': False,
              u'node': None,
              u'oss': True,
              u'outcome': u'success',
              u'owners': [u'levlaz'],
              u'parallel': 1,
              u'picard': {u'build_agent': {u'image': None,
                                           u'properties': {u'build_agent': u'0.0.4732-ed067b9',
                                                           u'executor': u'docker'}},
                          u'executor': u'docker',
                          u'resource_class': {u'class': u'medium',
                                              u'cpu': 2.0,
                                              u'ram': 4096}},
              u'platform': u'2.0',
              u'previous': {u'build_num': 91,
                            u'build_time_millis': 1919,
                            u'status': u'success'},
              u'previous_successful_build': {u'build_num': 91,
                                             u'build_time_millis': 1919,
                                             u'status': u'success'},
              u'pull_requests': [],
              u'queued_at': u'2018-03-10T18:29:32.788Z',
              u'reponame': u'sandbox',
              u'retries': None,
              u'retry_of': 91,
              u'ssh_disabled': True,
              u'ssh_users': [],
              u'start_time': u'2018-03-10T18:29:34.680Z',
              u'status': u'success',
              u'steps': [{u'actions': [{u'allocation_id': u'5aa4240cc9e77c00013bc7e5-0-build/4C67169D',
                                        u'background': False,
                                        u'bash_command': None,
                                        u'canceled': None,
                                        u'continue': None,
                                        u'end_time': u'2018-03-10T18:29:35.593Z',
                                        u'exit_code': None,
                                        u'failed': None,
                                        u'has_output': True,
                                        u'index': 0,
                                        u'infrastructure_fail': None,
                                        u'insignificant': False,
                                        u'name': u'Spin up Environment',
                                        u'output_url': u'https://circle-production-action-output.s3.amazonaws.com/64c10c100094c9d1e0424aa5-levlaz-sandbox-0-0?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Date=20180310T182936Z&X-Amz-SignedHeaders=host&X-Amz-Expires=431999&X-Amz-Credential=AKIAIQ65EYQDTMSJK2DQ%2F20180310%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Signature=db22e946ba891c0c89503a3b0f5de635be92e6802e3941db778a198658f0afaa',
                                        u'parallel': True,
                                        u'run_time_millis': 877,
                                        u'start_time': u'2018-03-10T18:29:34.716Z',
                                        u'status': u'success',
                                        u'step': 0,
                                        u'timedout': None,
                                        u'truncated': False,
                                        u'type': u'test'}],
                          u'name': u'Spin up Environment'},
                         {u'actions': [{u'allocation_id': u'5aa4240cc9e77c00013bc7e5-0-build/4C67169D',
                                        u'background': False,
                                        u'bash_command': u'#!/bin/sh\nset -e\n\n# Workaround old docker images with incorrect $HOME\n# check https://github.com/docker/docker/issues/2968 for details\nif [ "${HOME}" = "/" ]\nthen\n  export HOME=$(getent passwd $(id -un) | cut -d: -f6)\nfi\n\nmkdir -p ~/.ssh\n\necho \'github.com ssh-rsa AAAAB3NzaC1yc2EAAAABIwAAAQEAq2A7hRGmdnm9tUDbO9IDSwBK6TbQa+PXYPCPy6rbTrTtw7PHkccKrpp0yVhp5HdEIcKr6pLlVDBfOLX9QUsyCOV0wzfjIJNlGEYsdlLJizHhbn2mUjvSAHQqZETYP81eFzLQNnPHt4EVVUh7VfDESU84KezmD5QlWpXLmvU31/yMf+Se8xhHTvKSCZIFImWwoG6mbUoWf9nzpIoaSjB+weqqUUmpaaasXVal72J+UX2B+2RPW3RcT0eOzQgqlJL3RKrTJvdsjE3JEAvGq3lGHSZXy28G3skua2SmVi/w4yCE6gbODqnTWlg7+wC604ydGXA8VJiS5ap43JXiUFFAaQ==\nbitbucket.org ssh-rsa AAAAB3NzaC1yc2EAAAABIwAAAQEAubiN81eDcafrgMeLzaFPsw2kNvEcqTKl/VqLat/MaB33pZy0y3rJZtnqwR2qOOvbwKZYKiEO1O6VqNEBxKvJJelCq0dTXWT5pbO2gDXC6h6QDXCaHo6pOHGPUy+YBaGQRGuSusMEASYiWunYN0vCAI8QaXnWMXNMdFP3jHAJH0eDsoiGnLPBlBp4TNm6rYI74nMzgz3B9IikW4WVK+dc8KZJZWYjAuORU3jc1c/NPskD2ASinf8v3xnfXeukU0sJ5N6m5E8VLjObPEO+mN2t/FZTMZLiFqPWc/ALSqnMnnhwrNi2rbfg/rd/IpL8Le3pSBne8+seeFVBoGqzHM9yXw==\n\' >> ~/.ssh/known_hosts\n\n(umask 077; touch ~/.ssh/id_rsa)\nchmod 0600 ~/.ssh/id_rsa\n(cat < ~/.ssh/id_rsa\n$CHECKOUT_KEY\nEOF\n)\n\n# use git+ssh instead ofhttps\ngit config --global url."ssh://[email protected]".insteadOf "https://github.com" || true\n\nif [ -e /home/circleci/sandbox/.git ]\nthen\n  cd /home/circleci/sandbox\n  git remote set-url origin "$CIRCLE_REPOSITORY_URL" || true\nelse\n  mkdir -p /home/circleci/sandbox\n  cd /home/circleci/sandbox\n  git clone "$CIRCLE_REPOSITORY_URL" .\nfi\n\nif [ -n "$CIRCLE_TAG" ]\nthen\n  git fetch --force origin "refs/tags/${CIRCLE_TAG}"\nelse\n  git fetch --force origin "webhooks:remotes/origin/webhooks"\nfi\n\n\nif [ -n "$CIRCLE_TAG" ]\nthen\n  git reset --hard "$CIRCLE_SHA1"\n  git checkout -q "$CIRCLE_TAG"\nelif [ -n "$CIRCLE_BRANCH"]\nthen\n  git reset --hard "$CIRCLE_SHA1"\n  git checkout -q -B "$CIRCLE_BRANCH"\nfi\n\ngit reset --hard"$CIRCLE_SHA1"',
                                        u'canceled': None,
                                        u'continue': None,
                                        u'end_time': u'2018-03-10T18:29:36.075Z',
                                        u'exit_code': 0,
                                        u'failed': None,
                                        u'has_output': True,
                                        u'index': 0,
                                        u'infrastructure_fail': None,
                                        u'insignificant': False,
                                        u'name': u'Checkout code',
                                        u'parallel': True,
                                        u'run_time_millis': 415,
                                        u'start_time': u'2018-03-10T18:29:35.660Z',
                                        u'status': u'success',
                                        u'step': 101,
                                        u'timedout': None,
                                        u'truncated': False,
                                        u'type': u'test'}],
                          u'name': u'Checkout code'},
                         {u'actions': [{u'allocation_id': u'5aa4240cc9e77c00013bc7e5-0-build/4C67169D',
                                        u'background': False,
                                        u'bash_command': u"#!/bin/bash -eo pipefail\necho 'Hello!'\n",
                                        u'canceled': None,
                                        u'continue': None,
                                        u'end_time': u'2018-03-10T18:29:36.093Z',
                                        u'exit_code': 0,
                                        u'failed': None,
                                        u'has_output': True,
                                        u'index': 0,
                                        u'infrastructure_fail': None,
                                        u'insignificant': False,
                                        u'name': u'Do Nothing',
                                        u'parallel': True,
                                        u'run_time_millis': 13,
                                        u'start_time': u'2018-03-10T18:29:36.080Z',
                                        u'status': u'success',
                                        u'step': 102,
                                        u'timedout': None,
                                        u'truncated': False,
                                        u'type': u'test'}],
                          u'name': u'Do Nothing'}],
              u'stop_time': u'2018-03-10T18:29:36.099Z',
              u'subject': u'test hooks',
              u'timedout': False,
              u'usage_queued_at': u'2018-03-10T18:29:32.763Z',
              u'user': {u'avatar_url': u'https://avatars2.githubusercontent.com/u/7981032?v=4',
                        u'id': 7981032,
                        u'is_user': True,
                        u'login': u'levlaz',
                        u'name': u'Lev Lazinskiy',
                        u'vcs_type': u'github'},
              u'username': u'levlaz',
              u'vcs_revision': u'4ee0d32afb7ff5e821593366616a660c9720b70e',
              u'vcs_tag': None,
              u'vcs_type': u'github',
              u'vcs_url': u'https://github.com/levlaz/sandbox',
              u'why': u'retry'}}
127.0.0.1 - - [10/Mar/2018 10:29:36] "POST / HTTP/1.1" 200 -

Thank you for reading! Share your thoughts with me on bluesky, mastodon, or via email.

Check out some more stuff to read down below.

Most popular posts this month

Recent Favorite Blog Posts

This is a collection of the last 8 posts that I bookmarked.

Articles from blogs I follow around the net

Social media reimagined

We’re all familiar with social media: the Facebooks, the Twitters, the TikToks of this silly digital world. They have invaded our lives and taken over our time and attention. We have spent the past decade posting, snapping, tweeting, reeling (?), …

via Manuel Moreale — Everything Feed March 19, 2026

Pokemon Go created a 3D map of the world – but for what?

You may have seen the recent headlines about how a company called Niantic Spatial is using a database of real-world locations that was originally compiled by players of the mobile game Pokemon Go — a game that launched about a decade ago and quickly becam…

via The Torment Nexus March 19, 2026

Pluralistic: Love of corporate bullshit is correlated with bad judgment (19 Mar 2026)

Today's links Love of corporate bullshit is correlated with bad judgment: Synergizing the strategic inflection points on the global data network. Hey look at this: Delights to delectate. Object permanence: Bluetooth headsets; Fruit sticker decoder; iP…

via Pluralistic: Daily links from Cory Doctorow March 19, 2026

Generated by openring