I need to know how to get live streaming in my web application from Milestone Server. Another thing I need to know how to create bookmark of live video with image from my web application to milestone server.

MIP
, , ,
2

In the Milestone Web Client Milestone is using a Mobile Server integration. Please download and explore the Mobile SDK.

http://doc.developer.milestonesys.com/mipsdkmobile/

Perhaps you can start a new thread about bookmarking. I am in doubt whether what you ask for is the use the bookmarking functionality that exists in XProtect Corporate and XProtect Expert? (Please start new question/thread.)

3

Actually I am creating a custom web application where I want to show live video streaming of a camera from milestone to my custom web application and this live video streaming should display in all browsers. User will select the camera from camera list attached with milestone and by selecting a specific camera, user will be able to see live streaming of that camera from my custom web application. Also I want to create bookmark on that live video streaming so that the bookmark will be saved in milestone and while saving the bookmark, I want to save image along with the bookmark.

I am looking for the proper way and code to do this. It will be helpful for me if someone would suggest me the way to achieve this and some code reference so that I can implement in my asp.net web application.

4

http://doc.developer.milestonesys.com/mipsdkmobile/index.html?base=samples/LoginAndShowStreams_4.html&tree=tree_4.html

5

Hi Bo,

in this link there are some paths that the samples are in them. But where are these paths? I couldn’t find them.

Regards

6

Since then the documentation and the samples for Mobile SDK have been greatly improved.. You find it all here: https://doc.developer.milestonesys.com/mipsdkmobile/

7

Thanks for your fast reply. I think it’s better to describe more about my problem. I want to create my own web client to use milestone to show cameras in it and so on. I want to know if I can do it or not? If so, how can I do it? Using MIP SDK? Then, where is for example: \XPMobileSdk\Web\Samples\VideoPush.

Regards

8

Hi Mohammad,

Yes you can do it and you could use MIP SDK Mobile.

A good starting point will be sample located at:

\XPMobileSdk\Web\Samples\Video.

It demonstrates how to preview Live and Recorded video.

Please bear in mind that if you want to host your web application on different server than Mobile you have to change CORS settings in the Mobile server.

there is good explanation in this article:

XPROTECT MOBILE SERVER APP ON DIFFERENT SERVER

What you mentioned is a sample for opposite action - pushing video from web client to XProtect VMS (for example getting video from a web camera, trough the browser)

9

Hi Petar,

Thanks for your useful reply. I have a very big problem that I cannot understand where do you mean by \XPMobileSdk\Web\Samples\Video.

Where should I find this path? It’s on the web or I should install something? I should download something, or anything else?

Regards

10

Hi Mohammad,

There are two possibilities:

  • You could search directly in the Mobile server installation folder.

It is usually somewhere at “[C:\Program](file:C:/Program) Files\Milestone\XProtect Mobile Server”. There you can find “Web” folder and in it you can find “XPMobileSDK\Samples” where are places all the samples.

So relatively to the “Web” folder your sample will be in “XPMobileSDK\Samples\Video”.

In order to host this sample visible directly in the Mobile server please delete (rename) “videoSample.html.download” file.

Now sample should be accessible at: “http://:8081/XPMobileSDK\Samples\Video/videoSample.html”.

  • Alternatively you could download and install the MIP SDK Mobile and host the samples at your server (Apache, IIS or whatever).

In the downloaded archive you can navigate to "\Web\Samples\Video".

In that case however you will need to deal with the CORS.

11

Thank you a lot, it helped me!

Another thing is that after handling CORS problem, when I login in the login form and get list of cameras, list of cameras is ok, but the problem is when I request for stream, a POST request is sent to the server. This request gets 200 OK and a VideoId and StreamId. But when after that, the WebSocket request is sent, no progress is made.

Besides the video sample file, sends OPTIONS request extra than the original web application. (Why?)

When I checked everything with the original web application, I found that the cookies are not sent by the video sample to server. The original web application after GET request to VideoId, start getting blob of images, but video sample does not.

Is this the only problem?

How should I get video stream here in this step?

Regards

12

Hi Mohammad,

I would assume that this extra “OPTIONS” request is made by the browser itself during establishment of the WebSocket connection.

It seems that in your case, for some reason, websocket connection is not established.

What is the response of the OPTIONS btw ?

What you can try however is to disable web-sockets and switch to AJAX.

After successful login to the Mobile server you could add in your code:

XPMobileSDK.toggleWebSocket(false);

This should make video working (on AJAX).

Btw, another possibility is websockets to be blocked by some network device (router, gateway, firewall, etc.).

13

Hi Petar,

Thanks for your reply. Is there any example or documentation for using AJAX for this purpose? I cannot understand how to use AJAX for this.

Regards

14

It is built-in functionality into the SDK.

Just writing

XPMobileSDK.toggleWebSocket(false);

Should do the trick.

KR

15

Thanks a lot.

I’m using the video sample located on XProtect Mobile Server\Web\XPMobileSDK\Samples\Video. Is there any document or can you help me to find where to add this code? I couldn’t find login section to add this piece of code after successful login.

Regards

16

You can put it in videoSample.js right after

Application.connectionDidLogIn(container);

Or the hole file should look like:

(function () {
    window.addEventListener('load', function () {
        var connectionDidLogIn = function () {
            var container = document.getElementById('streams-container');
 
            Application.connectionDidLogIn(container);
 
            XPMobileSDK.toggleWebSocket(false);
        };
 
        var params = {
            connectionDidLogIn: connectionDidLogIn
        };
 
        LoginManager.loadAndLogin(params);
    });
})();
17

Hi Anirban,

If I understand your needs correctly, it could be better to look at the Web samples, as you will need to embed JS SDK into your web page, hosted in ASP.NET.

The Bookmark thing however is something that I’m not sure could be made in the Milestone VMS at all.

18

Hello Petar, thank you for providing me a new way to achieve my goal. It will be very helpful for me if you could provide me some link about the Web samples and JS SDK to embed in my web application to retrieve live streaming.

19

Hi Anriban,

You can find JS (Web) samples at:

http://doc.developer.milestonesys.com/mipsdkmobile/index.html?base=samples/LoginAndShowStreams_4.html&tree=tree_4.html&s1oid=00D200000008Uid&OpenCommentForEdit=1&s1nid=0DB0O000000Kzmh&emkind=chatterCommentNotification&s1uid=0050O00000726L3&emtm=1526647566199&fromEmail=1&s1ext=0

20

Thank you very much Petar. I have started working with this link.