ヘルニアクソ野郎エンジニアblog

~ヘルニアでHell near~

CGIのpythonスクリプトにjavascriptから連続して値を渡す方法「touchstartとsetInterval」

calendar

reload

CGIのpythonスクリプトにjavascriptから連続して値を渡す方法「touchstartとsetInterval」

以前、CGIを使ってjavascriptからpythonへ値を受け渡す方法についてまとめました。↓

 

これは、ブラウザをコントローラーとして、jsからpythonに値を渡し、サーボモーターを制御したい為に採用した方法になります。python httpサーバー(HTML)→js(Ajax)→pythonスクリプト(CGI)→モーター

しかし、例えばDCモーターを制御したいだけならばpythonスクリプトでマイコンのgpioピンの出力をHIGHE,LOWにすればいいだけですので(それだけで連続して動いてくれる)、jsからクリックイベントで単発の値を受け渡すだけで良いですが、サーボモーターの場合ですとそうはいきません。

pythonスクリプトではwhileのループ処理が使えず、一連の動きの後に止まってしまうので、連続して動かしたい場合は都度jsの発火イベント(htmlのボタンをクリック)を発生させる必要があります。

今回はこれを解消すべく、「ボタンを押し続けている間は一定の間隔でjsからpythonへ値を受け渡す」方法についてまとめたいと思います。これで、例えば2足歩行ロボットの歩行動作を、ボタンを押している間は前進し、離すと止まる、といったことが可能になります。

 jsの「touchstart」と「setInterval」を使います。

 

スポンサーリンク

html

操作画面になります。

 

javascript

以前まとめたのソースではclickイベントとしていましたが、今回は「touchstart」イベントを使用しました。スマホ専用になりますが、タッチすると{}に記述したメソッドが実効されます。今回はそこに「setInterval」関数を埋め込んでいます。これは、指定した間隔で{}内のメソッドを繰り返します。したがって、今回の場合だとボタンを押している間は2000ms/毎にchange_motor関数が呼び出される仕組みになっています。

change_motor関数では、Ajaxでpythonに文字列をpostしているので、つまり2000ms/毎に文字列をpostする事になります。(モーターを動作させるトリガー)

ボタンを離せば「touchend」イベントが発生するので、change_motor関数でモーターを停止させる文字列を指定し、かつ「clearInterval」でsetIntervalを停止させています。clearIntervalの引数にはsetInterval関数を指定します。

なお、setInterval内の処理は、1度目も引数に指定した時間経過後に実行されてしまうので、それを防ぐ意味でsetIntervalの前にchange_motor関数を1度呼び出して実行させています。

また、setIntervalの時間指定は、「サーボモーターの一連の動作終了時間」に合わせると良い感じで連続して動作します。

 

python

今回は分かりやすくjsからpostされた値をjsに返して、コンソール画面に出力するだけのコードにしています。

それでは、python http serverを立ち上げて動作を確認してみます。

うまく動作していれば、ボタンを押している間は、指定した時間の間隔で文字列がやり取りされているはずです。↓