Integrate with Eventbrite Manage

How to Receive the OAuth Token Inside Your App

Installed apps are displayed inside an iframe on Eventbrite. The iframe URL will include an ?esr=<ESR> query parameter. The ESR is a JSON Web Token with encoded data for the current user_id, their auth_token, an optional event_id for the event they will be managing and is then signed with the client secret.

Note: The key is called auth_token.

You can decode the JSON Web Token using a npm package, such as jsonwebtoken. In the example below, we are using the verify method to decode the ESR query parameter passing our CLIENT_SECRET.

try {
    var decodedToken = jwt.verify(query.esr, CLIENT_SECRET);
} catch (e) {
    // handle error
}

Iframe Sizing

To operate as an iframe within Eventbrite, your app must support a javascript API that coordinates events between your code and Eventbrite. This helps handle cases like resizing the window or other changes reflected in the container page.

Your app is expected to load this javascript and trigger events which inform the parent iframe container when your app is ready or needs updating.

You can load it with the following snippet:

<script src="https://ebmedia.eventbrite.com/s3-build/26869-rc2015-01-26-a5d995d/django/js/src/plugins/api.js"></script>

Once your app is ready, it should call init() to signal to the container:

EB.FrameAPI.init();

This informs the container that your app is ready and rendered so it can properly size the iframe and show it to the user.

Later, if you change your content and require a re-render, you should call EB.FrameAPI.resize() which informs the container of a need to attempt to resize the iframe.

Likewise, your app can be informed when the container is attempting to resize (due to the user changing sizes or orientations for example) by listening for events by passing a callback to init():

EB.FrameAPI.init({
    callback: function(event) {
        ...
    }
})

Note: If your app performs client-side rendering that modifies the layout, you must trigger resize() after to allow the container to keep your iframe sized correctly.