Go Back   PCMech Forums > Help & Discussion > Web Design / Development

Need Some Help? Type Your Keywords Here:

Reply
 
LinkBack Thread Tools Search this Thread Rate Thread Display Modes
Old 06-28-2011, 02:18 PM   #1
Member (10 bit)
 
Join Date: Aug 2005
Location: Vancouver, BC, Canada
Posts: 976
Multiple MJPEG streams in browser

I'm running a server with Linux Motion and 4 cameras. Each camera is broadcasting on a separate port.
If I open firefox and direct it to http://myserverort1 then I see one stream. If I direct it to myserverort2 I see the second stream.
Obviously FF has no problem displaying a MJPEG stream.
How do I create a web page that displays all 4 streams in a single page?

Thanks.
__________________
If you remind me of my dog... we'll probably get along.
peekaboo is offline   Reply With Quote
Old 06-28-2011, 03:16 PM   #2
Barefoot on the Moon!
Staff
Premium Member
 
Force Flow's Avatar
 
Join Date: Aug 2002
Location: Northeastern USA
Posts: 13,385
Look at the HTML code and see what's happening. Beyond that, I couldn't tell you without looking at it.
__________________
There are two secrets to staying young, being happy, and achieving success. You have to laugh and find humor every day, and you have to have a dream.
Force Flow is offline   Reply With Quote
Old 06-28-2011, 10:43 PM   #3
Member (10 bit)
 
Join Date: Aug 2005
Location: Vancouver, BC, Canada
Posts: 976
Found a solution:
HTML Code:
<body>
<img src="http://192.168.0.114:8081?refresh=0.0" width="640" height="480"> 
<img src="http://192.168.0.114:8082?refresh=0.0" width="640" height="480">
<img src="http://192.168.0.114:8083?refresh=0.0" width="640" height="480">
<img src="http://192.168.0.114:8084?refresh=0.0" width="640" height="480">  
</body>
peekaboo is offline   Reply With Quote
Old 06-29-2011, 03:15 PM   #4
Member (4 bit)
 
Join Date: Apr 2008
Location: Naperville, IL
Posts: 11
Another possible solution would have been to use iframes in the HTML.
Shadowjack is offline   Reply With Quote
Old 06-29-2011, 03:19 PM   #5
Barefoot on the Moon!
Staff
Premium Member
 
Force Flow's Avatar
 
Join Date: Aug 2002
Location: Northeastern USA
Posts: 13,385
Quote:
Originally Posted by Shadowjack View Post
Another possible solution would have been to use iframes in the HTML.
If you did that, you would have to deal with scrolling in each window. It's better to embed them all in the same frame/window.
Force Flow is offline   Reply With Quote
Old 06-30-2011, 01:14 PM   #6
Member (4 bit)
 
Join Date: Apr 2008
Location: Naperville, IL
Posts: 11
It depends on what you are trying to do. In this case it looks like he knows the actual sizes of the feeds, so could just set the size of the iframe to fit. We have a browser application that automatically resizes the iframe when its content changes. This is certainly not the best solution for everything (or most things), but sometimes it is appropriate.
Shadowjack is offline   Reply With Quote
Old 10-15-2011, 12:30 PM   #7
Member (10 bit)
 
Join Date: Aug 2005
Location: Vancouver, BC, Canada
Posts: 976
Now I'd like to access the stream from work.
When I open the webpage from work I see placeholders (broken image link) for the image streams. When I view the image properties/location I see 192.168.114:8081 (and 8082, 8083 and so on) which is fine when I open the webpage from within my network but obviously doesn't work from outside.
How do I get it to work?
Thanks.
peekaboo is offline   Reply With Quote
Old 10-15-2011, 01:02 PM   #8
glc
Forum Administrator
Staff
Premium Member
 
glc's Avatar
 
Join Date: May 2000
Location: Joplin MO
Posts: 37,790
Those ports have to be forwarded in your router to the local IP address, and you have to connect using your real IP address.
glc is online now   Reply With Quote
Old 10-15-2011, 02:18 PM   #9
Member (10 bit)
 
Join Date: Aug 2005
Location: Vancouver, BC, Canada
Posts: 976
I am using my real ip and forwarding to the correct location. The web page (the basic html code that I listed in a previous post) loads but the streams do not.
The webpage that loads is supposed to load all the streams to a single page (for easy viewing).
It looks like this:

refreshing image from server:8081 | refreshing image from server:8082
refreshing image from server:8083 | refreshing image from server:8084

How do I make it so the image loads from the serverort location and not sends the viewing browser to search for an image at its own 192.168.0.114:8081 which obviously doesn't contain my stream?
peekaboo is offline   Reply With Quote
Old 10-18-2011, 01:32 PM   #10
Member (4 bit)
 
Join Date: Apr 2008
Location: Naperville, IL
Posts: 11
As glc stated above, you need to use a real Internet IP address in your web page. You cannot use a locally assigned IP address that is not available outside of the local server network.

After rereading your last post, you cannot use the internal IP address within the HTML. You need to use the real address there as well. If your HTML code is not using the 192.168 addresses as in your sample code, then you have some other connectivity issue. I would check your web server access logs to see if the URL requests are coming through for those streams.

Last edited by Shadowjack; 10-18-2011 at 01:40 PM. Reason: Clarification
Shadowjack is offline   Reply With Quote
Reply

Bookmarks

Still Need Help? Type Your Keywords Here:


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is On
Trackbacks are On
Pingbacks are On
Refbacks are On



All times are GMT -5. The time now is 07:47 AM.
Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2012, vBulletin Solutions, Inc.
SEO by vBSEO 3.6.0 PL2