Receiving Images Through Websockets Example

This example shows how to automatically load and play a Eagle Eye Networks preview stream through a public webpage. There are two components needed for this demo. There is a server componenet that securely generates the auth_token needed for the API call. It is available on Github.

The second component is the client side JavaScript that is in this page. This page uses the websockets that are built into modern web browsers. The source for this page is also on Github.

This page calls the server component to get the list of cameras, account id, brand subdomain, and auth_key. Once it has those values it can construct a websocket connection to our Poll Stream. The resource type will be `image`. This will send the contents of the preview image as a base64 encoded string. Each image will include an `epoch` value. When you acknowledge the latest epoch value it will send the next image.

Live demonstration of preview stream

What about CORS?

Websocket connections are not subject to the CORS browser restrictions. This means that you do not need to contact us to whitelist your domain.

What else can we do with this?

This is an efficient way to quickly add a stream of preview images from a camera. This means that it can be used in more applications and more uses.

I hope you found this helpful. If you have any questions please feel free to reach out to us at api_support@een.com