short lecture note for building a web-based UI of a ROS system (in Japanese)
それでは、roswwwを用いて、パッケージにウェブサーバーの機能を追加してみましょう。
package.xmlにroswwwへの依存関係を追加します。
<exec_depend>roswww</exec_depend>
launchファイルを作成し、roswwwとrosbridge_serverを起動させるよう設定します。既存のlaunchファイルに追記してもいいですし、新しくlaunchファイルを作成してもいいです。
<arg name="port" default="8085"/> <!-- Apacheのデフォルトポートは避ける(普通は80) -->
<arg name="webpath" default="www"/> <!-- ウェブサーバーのルートディレクトリにするフォルダへの相対パス -->
<arg name="use_roswww" default="true" />
<!-- 以下はコピペするだけでOK -->
<include if="$(arg use_roswww)" file="$(find rosbridge_server)/launch/rosbridge_websocket.launch" />
<include if="$(arg use_roswww)" file="$(find roswww)/launch/roswww.launch">
<arg name="port" value="$(arg port)"/>
<arg name="webpath" value="$(arg webpath)"/>
</include>
パッケージの中にwwwフォルダを作成しましょう。このフォルダ(厳密には、launchファイルでwebpathに設定したフォルダ)が、ウェブサーバーのルートディレクトリになります。講習資料のsample/simple_staticディレクトリの中身を、wwwフォルダにコピーしてみましょう。
roslaunchした後、http://localhost:8085/%YOUR_PACKAGE_NAME% にアクセスしてみましょう。www/index.htmlの内容が表示されているはずです。
このサンプルは、静的なコンテンツでしかありませんが、roslibjsを使うことで、topic通信など、ROSの機能が使えます。