Triggering Traces with Checkly

Checkly provides a better way to monitor your APIs and site click flows, specifically by running a headless Chrome browser controlled by the library Puppeteer across multiple data centers to visit your webseite. Combined with Tideways this allows to automatically trigger a PHP Profiler for your most important site functionality, even if its using complex Javascript and Ajax requests.

The beauty of Checkly is that you can just upload your Puppeteer scripts written in Javascript and don't have to deal with running a headless Chrome on your infrastructure.

And integration with Tideways is simple. 

  • Log into your Checkly account and click on "Code Snippets" (<> Icon) in the left menu.
  • Click on "+ ADD CODE SNIPPET"
  • Create a snippet with the name "tideways_helpers" and the following code and save:
var crypto = require('crypto-js');

const tideways_add_header = page => {
    if (typeof(process.env.TIDEWAYS_APIKEY) == 'undefined') {
        return
    }
    
    let time = (new Date(Date.now() + 1000*60*30).valueOf())
    let payload = 'method=&time=' + time + '&user='
    let apiKey = crypto.MD5(process.env.TIDEWAYS_APIKEY).toString(crypto.enc.Hex)
    let hash = crypto.HmacSHA256(payload, apiKey)

    page.setExtraHTTPHeaders({ "X-Tideways-Profiler": "hash=" + hash.toString(crypto.enc.Hex) + "&" + payload});
}

The snippet can be re-used across your Browser checks. Create a new check to include the tideways_helpers snippet with the template syntax " {{> tideways_helpers}}" and call the function "tideways_add_header(page)". See this very simple example that queries a single page on example.com:

{{> tideways_helpers}}

const puppeteer = require("puppeteer");

const browser = await puppeteer.launch();
const page = await browser.newPage();

await tideways_add_header(page); // adds the necessary HTTP headers to trigger callgraphs on every request.

await page.goto("https://example.com");

await browser.close();

Then you need to open the "VARIABLES" tab in the check and add a new variable called "TIDEWAYS_APIKEY". Copy the Tideways API Key from your application and don't forget to click "Save Check".

The Checkly check will now generate callgraph traces on your page whenever it is running.

Still need help? Write [email protected] Write [email protected]