That is quite easy - there is a standard powerful way ROS community has opened up ROS to the web technologies - roslibjs
In a nutshell you need take 3 key steps:
1) Install ros-melodic-rosbridge-server
package (adopted from this tutorial ):
$ sudo apt-get install ros-melodic-rosbridge-server
2) Includerosbridge_websocket.launch
into the launch of your system along with turtlebot launch (adopted from this tutorial ):
<launch>
<include file="$(find rosbridge_server)/launch/rosbridge_websocket.launch" <arg="" name="port" value="8080"/>
</include>
</launch>
3) Include rolslib.js
or rolslib.min.js
into your HTML page and you will be able to easily publish/subscribe to/from topics, work with action servers as well as execute other ROS functionality like setting/getting parameters, etc. See this tutorial.
For example, publishing to a topic is as simple as following code:
//declare reference to the topic that already exists in ROS backend
var cmdVel = new ROSLIB.Topic({ros : ros,
name : '/cmd_vel',
messageType : 'geometry_msgs/Twist' });
//create command message
var command = new ROSLIB.Message({
linear : {
x : 0.1,
y : 0.2,
z : 0.3
},
angular : {
x : -0.1,
y : -0.2,
z : -0.3
} });
//publish the command to the topic
cmdVel.publish(command);
EDIT: important note about 3):
Websocket server in ROS Melodic version of rosbridge-server enforces more web security then older versions. Therefore, you are not able to connect to the rosbridge-server from a HTML page that is not served from the same origin. For example, if you simply try to open your HTML page directly from a file on your local PC then websocket connection will fail because websocket server inside of rosbridge-server will refuse such connection. to
The way to solve connection issue is to have a web server serving your HTML page which you want to do eventually for your system anyway.
Here you have options. For example:
1) For simple tests running on your local Ubuntu 18.04 you can serve your HTML page(s) by running simple HTTP server provided by Python3 on your Ubuntu (see this answer)
cd /my/html/files #directory where your HTML page is located
python3 -m http.server 8080
Then you can run your page by pointing any browser to http://localhost:8080/your_page.html (tested in both FireFox and Chrome)
2) Eventually if would like to have ROS-based system using this technology you can consider using roswww ROS package to serve your application's HTML pages. We have been successfully using it for a few years now
Do you mean that you want to run only control user interface in the browser or also Gazebo user interface in the browser?
i want to control user interface in the browser (for example have up, down, left, right buttons on the website) that when pressed moves the robot in gazebo