MJPG-streamer カメラをブラウザから起動/終了させる

お母ちゃん  2017.3.15 
Home > Raspberry Pi > MJPG-streamer カメラをブラウザから起動/終了させる
すき 0
うんこ 0

ブラウザからON/OFF出来るボタンを付けてみました。

C言語でラッパープログラム作成

プログラムを置く任意の場所に移動

起動用プログラム

起動用ファイルを作成

記述、保存

コンパイル

SUID(Set User ID)

起動出来るかテスト

終了用プログラム

起動用ファイルを作成

記述、保存

SUID(Set User ID)

終了出来るかテスト

実行用PHP

任意の場所に作成

mjpg-streamer.php

ブラウザからPHPにアクセスして起動・終了のテスト

HTML 

ボタンを作成

JavaScript

HTML&JSの デモソースコード

GitHubにもあげてみました。

MJPG-streamer-Button/index.html at master · homemadegarbage/MJPG-streamer-Button
mjpg-streamer.php の /パス/ の部分を修正して頂ければ、アップロードしてそのまま動く形になっているかと思います。

完成

※ 上記スクリーンショットは、MJPG-Streamer の埋め込み&ボタンに当ブログ上のCSSが当たっている状態です。デモソースコードではMJPG-Streamerの埋め込みはしておらず、HTMLデフォルトのボタンのみ表示されている状態になります。

MJPG-Streamer の埋め込みについては、こちらの記事に記載しております。

MJPG-streamer カメラをブラウザから起動/終了させる

スマホからも・・・

参考にさせて頂きました

「MJPG-streamer カメラをブラウザから起動/終了させる」への5件のフィードバック

  1. USBカメラをブラウザからON/OFF出来たらなぁと思っていたらこちらに辿り着きました。
    実行用PHPで、ブラウザからPHPにアクセスして、
    mjpg-streamer.php?action=open
    mjpg-streamer.php?action=close
    で、起動・終了のテストは出来たのですが、
    HTMLボタンから出来ません。
    ボタンが表示されませんし、Javascriptも動いていないような気がします。
    mjpg-streamer.phpファイルを置くディレクトリが、
    mjpgstreamerのファイルが置かれている場所が正しいのか?
    webサーバーの公開ディレクトリが正しいのか?
    もう少し詳しく教えてもらえないでしょうか?
    これが出来たら、スナップショットが撮れるボタンも作って、
    その画像も見れるようにしたいなぁと思っております。

    1. 二児のパパさん、コメントありがとうございます。

      HTMLとJSデモソースコードを追記しました。
      また、GitHubにもアップロードしてみました。
      mjpg-streamer.php の /パス/ の部分を修正して頂ければ、ファイルをアップロードしてそのまま動く形になっているかと思います。

      デモソースコードでは、index.html と mjpg-streamer.php が同じ階層で動くようになっています。
      webサーバの公開ディレクトリに、例えば mjpg-streamer-button などディレクトリを作成して頂き、そこに index.html と mjpg-streamer.php をアップロードして頂ければ動くかと思います。

      参考になりましたら幸いです。

  2. デモソースコードありがとうございました。
    うまく出来ました。
    1点訂正がありました。
    20行目の OFF
    ですが、
    id=”cameraOpen”になっています、id=”cameraClose”ですね。

    この流れに従って、
    mjpg-streamer_snapも追加で作り、
    wget -O /保存先/t1_`date +%Y%m%d%H%M%S`.jpg http://RaspberryPiのアドレス:8080/?action=snapshot

    Javascriptに
    document.getElementById(‘cameraSnap’).addEventListener(‘click’ ,function() {
    postMjpgStreamer(‘snap’);
    }
    ,false);
    を追加して、
    ボタンも
    SNAP
    も追加して、
    スナップショットを撮ったファイルを見れるようにPHPも作成して、
    念願叶いました、ありがとうございました。

    1. お役に立てたようで良かったです!
      ご指摘ありがとうございます、記事とGitの方も修正しました。

      スナップショット の方も作成されたのですね、
      コードもありがとうございます、参考になります✨

  3. ありがとうございます。
    ここの記事をほぼこままやっただけでずっとやりたかったことが実現できました。
    「C言語でラッパープログラム作成」がもともと想定したものと大幅に違ったのですが、PHPからシェルを実行する方法では実現できないのでしょうか?(昔、Rubyからシェルを実行しようとしてできなかったので)

コメントはこちらから

メールアドレスが公開されることはありません。コメントのみでもOKです。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください