(!) Please ask about problems and questions regarding this tutorial on answers.ros.org. Don't forget to include in your question the link to this page, the versions of your OS & ROS, and also add appropriate tags.

Writing an actionlib client with roslibjs

Description: This tutorial shows you how to create an actionlib client and pass a goal.

Keywords: roslibjs, web interface, actionlib, Robot Web Tools

Tutorial Level: BEGINNER

Getting Started

This tutorial involves writing a single HTML file, which will contain the HTML and JavaScript needed to communicate with ROS over rosbridge. To begin, create a file fibonacci.html with your favorite text editor.

The complete code for this tutorial can be found in the roslibjs repo.

The HTML Code

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <meta charset="utf-8" />
   5 <script src="http://static.robotwebtools.org/EventEmitter2/current/eventemitter2.js"></script>
   6 <script src="http://static.robotwebtools.org/roslibjs/current/roslib.js"></script>
   7 
   8 <script>
   9   var ros = new ROSLIB.Ros({
  10     url : 'ws://localhost:9090'
  11   });
  12 
  13   var fibonacciClient = new ROSLIB.ActionClient({
  14     ros : ros,
  15     serverName : '/fibonacci',
  16     actionName : 'actionlib_tutorials/FibonacciAction'
  17   });
  18 
  19   var goal = new ROSLIB.Goal({
  20     actionClient : fibonacciClient,
  21     goalMessage : {
  22       order : 7
  23     }
  24   });
  25 
  26   goal.on('feedback', function(feedback) {
  27     console.log('Feedback: ' + feedback.sequence);
  28   });
  29 
  30   goal.on('result', function(result) {
  31     console.log('Final Result: ' + result.sequence);
  32   });
  33 
  34   ros.on('connection', function() {
  35     console.log('Connected to websocket server.');
  36   });
  37 
  38   ros.on('error', function(error) {
  39     console.log('Error connecting to websocket server: ', error);
  40   });
  41 
  42   ros.on('close', function() {
  43     console.log('Connection to websocket server closed.');
  44   });
  45 
  46   goal.send();
  47 </script>
  48 </head>
  49 
  50 <body>
  51   <h1>Fibonacci ActionClient Example</h1>
  52   <p>Check the Web Console for output</p>
  53 </body>
  54 </html>

Code Explanation

Now that we have an example, let's look at each component.

   9   var ros = new ROSLIB.Ros({
  10     url : 'ws://localhost:9090'
  11   });

We need to create a Ros node object to communicate with a rosbridge server. In this example, the script will connect to localhost on the default port of 9090.

  13   var fibonacciClient = new ROSLIB.ActionClient({
  14     ros : ros,
  15     serverName : '/fibonacci',
  16     actionName : 'actionlib_tutorials/FibonacciAction'
  17   });

A ROSLIB.ActionClient acts an actionlib client, with the ability to send goals and receive responses from an actionlib server. In this example, we'll be calling the Fibonacci actionlib server, which computes a Fibonacci sequence based on the goal and provides feedback along the way.

The server name is the actionlib server name. Following the actionlib convention, the server name will be the prefix for topics to subscribe to, like /fibonacci/feedback, /fibonacci/result, etc.

The action name corresponds to the actionlib server base message type name to use.

Documentation of all the constructor options and available functions can be found in the ROSLIB.ActionClient docs.

  19   var goal = new ROSLIB.Goal({
  20     actionClient : fibonacciClient,
  21     goalMessage : {
  22       order : 7
  23     }
  24   });

ROSLIB.Goal is an actionlib goal to send to the actionlib server. In this case, the goal is Fibonnaci sequence length to compute to. The ROSLIB.Goal docs describe all the constructor options and functions available.

  26   goal.on('feedback', function(feedback) {
  27     console.log('Feedback: ' + feedback.sequence);
  28   });

After a goal is sent to the actionlib server, the server will provide "feedback" updates while reaching its goal. In this case, every new computed Fibonacci number will return as a "feedback" event, which will be outputted to the Web Console in the callback function.

  30   goal.on('result', function(result) {
  31     console.log('Final Result: ' + result.sequence);
  32   });

When a goal was reached (or failed to reach), a "result" message will be emitted. This example prints out the result and the Fibonacci sequence it contains.

  34   ros.on('connection', function() {
  35     console.log('Connected to websocket server.');
  36   });

This adds a listener for a connection event to the ros object. The following two blocks do the same for error and close events. This way, we can monitor the connection to the rosbridge server.

  46   goal.send();

Finally, we send the goal to the actionlib server. Notice how the event handlers like goal.on('feedback', ...) are declared before sending the goal to be ready to handle events right away.

Running the Example

At this point we are ready to run the example. To do so, you will need to have installed the following packages:

  • ros-hydro-ros-base (basic ROS installation)
  • ros-hydro-rosbridge-server (rosbridge_server)

  • ros-hydro-actionlib-tutorials (Contains the Fibonacci actionlib server)

To begin, we will launch ROS. To do so, run the following in a terminal:

  • roscore

Next, we'll start the Fibonacci actionlib server:

  • rosrun actionlib_tutorials fibonacci_server

Once everything is running, we can launch the rosbridge v2.0 server with the following:

  • roslaunch rosbridge_server rosbridge_websocket.launch

Finally, you are now ready to bring up your HTML page in a web browser. You can open up the file directly in the browser without running a web server. The data outputted happens in the Web Console.

Wiki: roslibjs/Tutorials/ActionlibClient (last edited 2020-06-27 03:43:59 by JashMota)