ウェブカメラの写真をたくさんリロード

私は新しいウェブサイトプロジェクトを持っています。私はウェブカメラをたくさん持っています。ウェブカメラの写真をたくさんリロード

私は1つのウェブサイト上のすべてのウェブカメラを収集するウェブサイトを作っています。

私はソースコードを掲載しますが、再読み込みはしません。または画像がありません。ことが.JPGのIMGではなく、タイムスタンプをリロードし、使用して（* .JPG？= XXXXX」と）、タイムスタンプ、imgタグをリロードした場合）。

<!DOCTYPE html> 
<html lang="fr"> 
<head> 
    =D 
</head> 
<body> 
    <h1>Cam</h1> 
    <div id="grille" .col-xs-12 .col-sm-12 .col-md-12> 
     <ul> 
      <?php 
       try { 
        $bdd = new PDO('mysqlXXXXXXXXXXXX); 
       } 
       catch(Exception $e) { 
        die('Erreur : '.$e->getMessage()); 
       } 
       $reponse = $bdd->query('SELECT * FROM XXXXXX'); 
       while ($donnees = $reponse->fetch()) { 
        ?> 
        <li class="img_cams col-xs-12 col-sm-6 col-md-4 col-lg-2"> 
         <img id="<?php echo $donnees['num_cam']; ?>" src="<?php echo $donnees['src']; ?>" alt="<?php echo $donnees['title']; ?>" title="<?php echo $donnees['title']; ?>" /> 
        </li> 
        <?php 
       } 
       $reponse->closeCursor(); 
      ?> 
     </ul> 
    </div> 
    <div class="clear"></div> 

    <script src="bootstrap/jquery.js"></script> 
    <script src="bootstrap/bootstrap.min.js"></script> 
    <script type="text/javascript"> 
     <?php 
      try { 
       $bdd = new PDO('mysqlXXXXXXXXXXXX); 
      } 
      catch(Exception $e) { 
       die('Erreur : '.$e->getMessage()); 
      } 
      $reponse = $bdd->query('SELECT * FROM XXXXXX'); 
      while ($donnees = $reponse->fetch()) { 
       ?> 
       function loadImage(imgID, address) { 
        document.getElementById(imgID).src=''+address; 
       } 

       setInterval(function() { 
        loadImage("<?php echo $donnees['num_cam']; ?>", "<?php echo $donnees['src']; ?>"); 
       }, 1000); 
       <?php 
      } 
      $reponse->closeCursor(); 
     ?> 

     /* OLD SOURCS OF JS IN EXEMPLE */ 

     /* OK mais pas de refresh 
     setInterval(function() { 
      var imgCam = document.getElementById('706'); imgCam.src = 'http://XXXX/rt706/snap_c1.jpg'; 
      var imgCam = document.getElementById('709'); imgCam.src = 'http://XXXX/rt709.jpg'; 
     }, 2000); 
     */ 

     /* OK mais blanc 
     setInterval(function() { 
      var imgCam = document.getElementById('img_cams'); 
      imgCam.src = 'rt709.jpg?' + Math.random(); 
     }, 2000); 
     */ 
     /* OK mais blanc 
     function refresh() { 
      var imgCam = document.getElementById("img_cams"); 
      imgCam.src = imgCam.src + 'rt709.jpg?rand=' + Math.random(); 
     } 
     window.onload = function() { 
      setInterval(refresh,2000); 
     }; 
     */ 
    </script> 
</body>

出典

2016-04-01 Sigri44

<div id="grille" .col-xs-12 .col-sm-12 .col-md-12>

私はあなたが意図したと信じてclass=""属性内に他のプロパティが含まれている

また、あなたの質問は不明です。他の場所に保存されているウェブカム画像（通常の画像ファイルと同じにする必要があります）がありますか。ユーザのウェブカメラ（許可を得て）が写真を撮ることを許可する？

ユーザーのウェブカメラにアクセスするために探している場合は、次のURLをご覧取る：ここ https://www.kirupa.com/html5/accessing_your_webcam_in_html5.htm

は、彼らが必需品に至るまでのウェブサイト上で提供したコードの抜粋です：

著者から

<!DOCTYPE html> 
<html> 
<body> 
<div id="container"> 
    <video autoplay="true" id="videoElement"> 

    </video> 
</div> 
<script> 
var video = document.querySelector("#videoElement"); 

navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia || navigator.oGetUserMedia; 

if (navigator.getUserMedia) {  
    navigator.getUserMedia({video: true}, handleVideo, videoError); 
} 

function handleVideo(stream) { 
    video.src = window.URL.createObjectURL(stream); 
} 

function videoError(e) { 
    // do something 
} 
</script> 
</body> 
</html>

：

あなたはこのコードを追加したら、あなたのHTML文書を保存し、ページをプレビューします。サポートされているブラウザを使用している場合は、ブラウザにアクセス権を与えた後、ウェブカメラのビデオストリームが表示されます。

出典

2016-04-01 21:18:15

thx。それはストリーム映画ではなく、トラフィックウェブカムであり、画像はすべて秒間にリロードされ、ビデオフラックスはありません。私はこれをテストします。 – Sigri44

スニペットを使ってテストしますが、うまくいきません。私のソースはビデオではなく、単なる動画であり、すべての秒をリロードします。はい、これはIDであり、JSはIDタイプのみを受け入れるため、CLASSではありません。 – Sigri44

ウェブカメラの写真をたくさんリロード

答えて

関連する問題