Embed Eagle Eye History Browser

Eagle Eye Netowrks makes it easy to embed our history browser into your existing app or website. There are many applications where video can make the product significantly better. Showing recorded video is essential for reviewing transactions in Point of Sales systems, doors opening in Access Control, or counting cars going through a toll station.

Step 1: Construct the API Call

Each camera in our system has a unique identification number. We refer to this as the ESN. You can find the ESN for you camera by looking in camera settings. This will be passed into the URL as the `id` parameter

The second parameter is the time you want the history browser to start at. We use the UTC timezone and format our timestamp to be YYYYMMDDhhmmss.zzz with zzz being microseconds. An example EEN timestamp would be 20181225060000.000 for 6:00am on Christmas morning. This gets passed as the `ts` parameter.

There are several ways to supply the authorization token. It can be passed as a cookie with the request or as the `A` parameter. Passing it this way can be convenient for constructing URLs for the user. If it is not included, the browser will try to use a cookie for the domain. If that doesn't work the contents of the window will redirect to the login page.

Now that we know how to construct the URL, we can go ahead an put everything together. Our URL now looks like:


Step 2: Embedding the iFrame

You can add the following line to your webpage to embed the video player. The `src` attribute should be set to the correct URL.

<iframe src=" https://login.eagleeyenetworks.com/hist/index.html?id=device&ts=timestamp&A=auth_token">

What else can we do with this?

Including video with a single line of code is very powerful. You can combine video recordings with other data sources by finding corallated times of the event. Seeing the data and video side by side is very effective. I hope you found this helpful. Please feel free to reach out to me directly at mcotton@een.com