 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. |
Using action services in rosjs
Description: This tutorial describes how to create a Fibonacci simple action client in Javascript.Tutorial Level: BEGINNER
Contents
The code and examples used in this tutorial can be found in the rosjs_tutorials package. However it builds upon tutorials in the actionlib_tutorials You may want to read about the actionlib package before starting this tutorial.
Video
The Code
The following code can be found in remote_lab/rosjs_tutorials/tutorial_actionlib.html, and implements a simple javascript action client for the fibonacci action.
<!DOCTYPE html>
<html>
<head>
<title>rosjs Actionlib Tutorial</title>
<!-- REQUIRED scripts -->
<script type="text/javascript" src="js/jquery/jquery-latest.js"></script>
<script type="text/javascript" src="js/ros/ros.js"></script>
<script type="text/javascript" src="js/ros/common.js"></script>
<script>
function log(msg) {
$('#log').append(msg.toString() + '<br>');
};
function start()
{
log("Connecting to rosbridge.");
var node = new ros.NodeHandle("ws://localhost:9090");
node.setOnClose(function(e) {
log("Disconnected or Can't Connect.");
});
node.setOnError(function(e) {
log("Unknown error!");
});
node.setOnOpen(function(e) {
log("Connection to rosbridge established.");
var action_spec = new ros.actionlib.ActionSpec('actionlib_tutorials/FibonacciAction');
var client = new ros.actionlib.SimpleActionClient(node,'/fibonacci', action_spec);
log("Waiting for fibonacci action server to come online.");
client.wait_for_server(10, function(e){
if(!e) {
log("Couldn't find action server.");
return;
}
var goal = {'order':10};
log("Sending goal to action server.");
client.send_goal(goal);
log("Waiting for results from action server.");
client.wait_for_result(100,function(e) {
if(!e) {
log("Didn't receive results from action server.");
return;
}
var result = client.get_result(); // A FibonacciResult
log("Result:"+", "+result.sequence);
});
});
});
}
</script>
</head>
<body onload="start()" style="margin:0;padding:0;background-color:white;overflow:hidden">
<div style="font-family: fixed-width; font-size: small;" id="log"></div>
</body>
</html>
The Code, explained
<!DOCTYPE html> <html> <head> <title>rosjs Actionlib Tutorial</title> <!-- REQUIRED scripts --> <script type="text/javascript" src="js/jquery/jquery-latest.js"></script> <script type="text/javascript" src="js/ros/ros.js"></script> <script type="text/javascript" src="js/ros/common.js"></script>
The beginning of the website which includes the title that shows up at the top of the browser. Also it shows the included javascript pages. The first includes jquery, necessary for sending messages. ros.js and common.js are javascript files that define the functionality required for the web browser to communicate with ROS.
function log(msg) {
$('#log').append(msg.toString() + '<br>');
};This defines a log function that takes in a message, msg, and will append it to the text in the "log" <div>.
log("Connecting to rosbridge.");
var node = new ros.NodeHandle("ws://localhost:9090");
node.setOnClose(function(e) {
log("Disconnected or Can't Connect.");
});
node.setOnError(function(e) {
log("Unknown error!");
});
node.setOnOpen(function(e) {
log("Connection to rosbridge established.");This code initializes the websocket connection with rosbridge.
var action_spec = new ros.actionlib.ActionSpec('actionlib_tutorials/FibonacciAction');
var client = new ros.actionlib.SimpleActionClient(node,'/fibonacci', action_spec);Creates the simple action client, passing the type of the action, FibonnacciAction to the constructor.
log("Waiting for fibonacci action server to come online.");
client.wait_for_server(10, function(e){
if(!e) {
log("Couldn't find action server.");
return;
}- Waits until the action server has started up and started listening for goals.
var goal = {'order':10};Creates a goal to send to the action server.
client.send_goal(goal);
Sends the goal to the action server.
client.wait_for_result(100,function(e) {
if(!e) {
log("Didn't receive results from action server.");
return;
}
var result = client.get_result(); // A FibonacciResult
log("Result:"+", "+result.sequence);
});Waits for the server to finish performing the action. The results are then printed using the log function.
