2011-03-11 2 views
22

Existe-t-il un moyen léger, gratuit et fiable d'afficher MJPEG dans un environnement multi-navigateur? J'essaie d'afficher un flux MJPEG à partir d'une caméra IP Axis 2120 sur un site que je développe, et j'ai trouvé que c'est assez fiable dans les versions actuelles de Firefox. Cependant, après quelques tests, j'ai constaté que IE, Opera et Chrome ont tous des degrés de difficulté à faire cela (pas d'accès Mac, donc je ne suis pas sûr de Safari). Internet Explorer n'a aucun support pour MJPEG et ne fonctionne pas du tout. Opera prend littéralement 10-15 secondes pour afficher quoi que ce soit après que le GET initial a été envoyé. Chrome fonctionne parfaitement jusqu'à ce que le <div> qui contient le tag <img> soit masqué puis affiché à nouveau.Solution multi-navigateur pour afficher le flux MJPEG

Pour référence, je suis en utilisant une balise <img> pour afficher le flux comme ceci:

<img src="http://my.ip.addr/axis-cgi/mjpg/video.cgi/?resolution=352x240" alt="real-time video feed" /> 

J'ai pensé à utiliser un re-broadcasting server pour recueillir le flux MJPEG et transcoder sur la volée, mais cette solution semble trop moche. Y a-t-il de meilleures suggestions?

Répondre

5

Voici une applet Java solution que vous pouvez utiliser pour tout navigateur (ou tout simplement ceux qui ne prennent pas en charge MJPEG): http://www.charliemouse.com/code/cambozola/

En ce qui concerne d'autres bugs vont avec MJPEG, j'ai trouvé que vous devrait définir l'attribut 'src' de la balise 'img' sur quelque chose en plus du MJPEG avant d'essayer de supprimer la balise 'img'. Exemple:

<img src="#" /> 

Si vous ne le faites pas, Firefox continuera à télécharger flux MJPEG même si elle ne devrait pas.

+0

Merci Teddy. J'ai également remarqué que Firefox télécharge le flux alors qu'il ne devrait pas le faire. Votre conseil fonctionne bien. –

+0

Je sais que cette réponse est ancienne mais je vais demander dans l'espoir que vous vous attardez encore ici. mettre le src à '#' arrête le flux mjpeg sans un rafraîchissement dur? – moeiscool

+0

@moeiscool a fonctionné en 2011. Vous pouvez vérifier l'onglet réseau de l'inspecteur Web pour vous assurer que les choses fonctionnent comme prévu. – Teddy

9

Je viens de sortir une solution il y a quelques mois. C'est multi-plateforme, et n'a pas besoin de plugins tiers tels que Flash ou Java. Fondamentalement, il s'agit d'un proxy node.js qui analyse les limites m-jpeg et délivre des images dans un intervalle défini.

Fourchez-le à https://github.com/rodowi/Paparazzo.js

Questions connexes