Live Video Streaming
You can view live video from your device to view the road and the cabin as the vehicle moves.
The road-facing camera streams up to twenty four frames per second. The in-cabin camera streams fifteen frames per second.
Both the road-facing and in-cabin cameras stream for thirty seconds, and then give you the option to continue live streaming. This is hard-coded and cannot be changed.
Note
Your device must be online to view its live video.
When viewing live video, Surfsight uses webRTC streaming by default, but HLS streaming is also an option.
The rest of this guide shows you how to use the Surfsight API to live stream video directly from the devices, including these steps:
Click to collapse
1. Authenticate
Authenticate yourself with the POST /authentication
request.
Surfsight API uses Bearer authentication (also known as token authentication). The server generates a bearer token in response to a login request. The client provides this token in the Authorization header when making further requests.
You need an email address and password to get a token. When beginning your partnership with Surfsight, we send you an email containing this information.
Note
Every company can request up to nineteen additional sets of credentials.
To receive an authentication token:
Send the POST /authentication
request with the following structure:
A. In the request body, enter the email address and password you received from Surfsight.
An authentication token is returned. This is the authentication token you will use for subsequent requests.
curl --request POST 'https://api-prod.surfsight.net/v2/authentication'
--header 'Content-Type: application/json'
--data-raw '{
"email": "email@email.com",
"password": "123Abcd!"
}'
Note
The returned token is valid for twenty-four hours.
B. In any subsequent request, include the header, using the following structure:
```--header 'Authorization: ImahFWLZWFdD8VVcUtIED2YuOjPFlZpldQTE5tUqKdv'```
The following is an example of the `POST /organizations` request, with the token in the header.
```
curl --request POST https://api-prod.surfsight.net/v2/organizations
--header 'Content-Type: application/json'
--header 'Authorization: ImahFWLZWFdD8VVcUtIED2YuOjPFlZpldQTE5tUqKdv'
--data-raw '{
"name": "Missouri fleet"
}'
2. Connect media
Receive the authentication token and media server address to retrieve a recording or live video with
the POST /devices/{imei}/connect-media
request.
curl --request POST https://api-prod.surfsight.net/v2/devices/{imei}/connect-media
--header 'Content-Type: application/json'
--header 'Authorization: Bearer {token}'
Returned response:
{
"data": {
"address": "prodmedia-us-05.surfsolutions.com",
"mediaToken": "0e5d4dfb-56fe-4271-b9c8-86e4d7f214d5"
}
}
Note
The token is valid for thirty minutes. There is more than one media address that can be returned. The example above is one of the available media servers at the time of the request.
3. Request webRTC session ID from the media server
To receive the webRTC session ID, the client must first negotiate a communication channel using websocket to `wss://mediaServerAddress:8443`. The `mediaServerAddress` should be returned using `POST devices/{imei}/connect-media` request in the previous step. Upon succesfull communication channel with the media server, the returned messege will be as follow: `HELLO sessionId`. This will be a four-digit number.In some cases the initial connection might and the request will return 404 - Not Found
error. We recommend implementing a retry mechanism during this step if the error is catched.
4. Inspect active cameras live video
To request to see the lenses available for live streaming, perform the request GET /devices/{imei}/cameras
. cameraId 1
will be the front lens, and cameraId 2
will be the driver-facing lens.
Returned response:
{
"data": [
{
"cameraId": 1
},
{
"cameraId": 2
}
]
}
5. Open the SDP negotiation with the media server
Using the following URL format, perform the request GET https://mediaServerAddress/webrtc/sessionId/<imei>/cameraId/mediaToken
. You may also refer to the function sendMessageToStartCall
in the code example. A succesful connection will return the SDP information relevant to this connection.
If the response is 404
or a server error, your code is required to have a retry mechanism every three seconds.
Example code:
function sendMessageToStartCall(peer_id) {
var theUrl = original_source.replace("#PEERID#", peer_id.toString());
console.log(
"sendMessageToStartCall(): ",
theUrl /*JSON.stringify(options)*/
);
//making the https get call
httpGetAsync(theUrl, httpGetAnswer);
}
6.Create an RTCPeerConnection
An RTCPeerConnection()
(https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/RTCPeerConnection) function should be used in order to begin the streaming session between the user-client and the device.
Use the following rtc_configuration
with the RTCPeerConnection()
function: {iceServers: [{urls: "stun:stun.services.mozilla.com"}, {urls: "stun:stun.l.google.com:19302"}]
Once a connection is made, the client should receive the Incoming stream
message about which data the connection is sending. In this case, it will be video.
Example code:
function createCall(msg) {
// Reset connection attempts because we connected successfully
connect_attempts = 0;
console.log("Creating RTCPeerConnection");
peer_connection = new RTCPeerConnection(rtc_configuration);
peer_connection.onaddstream = onRemoteStreamAdded;
/* Send our video/audio to the other peer */
var browserInfo = getBrowserInfo();
if (browserInfo.name.toLowerCase() == "safari") {
local_stream_promise = getLocalStream()
.then((stream) => {
console.log("Adding local stream");
peer_connection.addStream(stream);
return stream;
})
.catch(setError);
} else {
local_stream_promise = new Promise(function (resolve, reject) {
resolve();
});
}
7. Accept and Send SDP information
Using RTCSessionDescription
protocol (https://developer.mozilla.org/en-US/docs/Web/API/RTCSessionDescription), accept and offer the SDP connection. You may also refer to the function onIncomingSDP
in the code example.
Example code:
function onIncomingSDP(sdp) {
peer_connection
.setRemoteDescription(sdp)
.then(() => {
setStatus("Remote SDP set");
if (sdp.type != "offer") return;
setStatus("Got SDP offer");
local_stream_promise
.then((stream) => {
setStatus("Got local stream, creating answer");
peer_connection
.createAnswer()
.then(onLocalDescription)
.catch(setError);
})
.catch(setError);
})
.catch(setError);
}
8. Start ICE candidate signaling
Using RTCPeerConnection.onicecandidate
protocol (https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/onicecandidate), create a connection directly between the user-client and the device. At this point, the connection is strictly between the user's browser and the device. You may also refer to onIncomingIce
function in the code example. The complete code is in the code sample. At this point, live video streaming should begin.
Example code:
function onIncomingICE(ice) {
var candidate = new RTCIceCandidate(ice);
peer_connection.addIceCandidate(candidate).catch(setError);
}
Sandbox environment
Surfsight has spent extensive time in providing you with the live video sample code to use in your application. We highly recommend using the sample code already provided in this page:
Refer to the sample application JavaScript example here for the complete code sample:
Use this HTML Embedded code for the code example. The code is only relevant to the user who is changing the parameters at the time, and will not save it to other users.
Only modify the “script.js” file with the variables of the user, password, cameraId, and IMEI. (US or DE env if needed as well)
Once the script is modifed, click the "Refresh Preview" icon in the sandbox enviroment's browser to begin the live video stream.