Recherche de code pour afficher deux webcams IP publiques

Question

Je suis principalement un gars c/C++. J'ai fait beaucoup de choses PHP, et maintenant je dois coder quelques JS.

Pour une maquette, je souhaite créer une page Web montrant le flux vidéo provenant de deux sources vidéo en direct. Nous avons des cames web basés sur IP sur commande et je suppose que ce sera juste un cas d'utilisation

<img src="IP address"> 

pour chaque web cam, avec peut-être quelques balises de taille d'image. Est-ce exact? En attendant, quelqu'un peut-il poster un exemple de code, de préférence avec un flux vidéo qui sera diffusé pendant les heures de jour en Australie? Vous pouvez être mignon créatif, mais s'il vous plaît être SFW. Merci.

Answer 1

Ce code utilise la méthode "pull" pour mettre à jour les images JPEG dans le navigateur. Il fonctionne en changeant la partie chaîne de requête de l'URL src pour forcer une recharge d'image, dix secondes après la dernière image a fini de charger (une démonstration en direct en utilisant l'imagerie webcam plage est à http://jsfiddle.net/kLUkA/2/):

function refreshCamera() { 
    var img = this; 
    setTimeout(function() { 
     var parts = img.src.split('?'); 
     parts[1] = new Date().getTime(); 
     img.src = parts.join('?'); 
    }, 10000); 
} 

function startCameraPull(img) { 
    img.onload = refreshCamera; 
    img.onload(); 
} 

window.onload = function() { 
    startCameraPull(document.getElementById('webcam1')); 
    startCameraPull(document.getElementById('webcam2')); 
}; 

Note: Vous pouvez supprimer la partie setTimeout dans refreshCamera pour éliminer le délai de rechargement.

Answer 2

Je ne suis pas sûr des éléments canvas ou video, mais je ne crois pas qu'ils prennent en charge les flux vidéo en direct pour le moment. Il semble que vous utilisiez des images statiques créées dynamiquement, mais si vous utilisez un flux vidéo, vous devrez utiliser Flash (ou Silverlight, ou un autre équivalent).