Executing a Shell Script from an Angular JS UI with NodeJS

Posted by


Node.js is a powerful JavaScript runtime that allows you to build server-side applications. If you’re working with AngularJS on the front end and need to execute a shell script from your UI, Node.js can help you achieve this.

In this tutorial, we’ll walk you through the steps of setting up a Node.js server to execute a shell script from an AngularJS UI.

Step 1: Install Node.js
First, make sure you have Node.js installed on your machine. You can download and install Node.js from the official website.

Step 2: Create a new Node.js project
Create a new directory for your project and navigate to it in the terminal. Run the following command to create package.json file that contains dependencies for your project:

npm init -y

Step 3: Install necessary packages
Now, install the necessary dependencies for your project. You’ll need to install the Express framework to create a web server and the child_process module to execute shell commands. Run the following commands to install these packages:

npm install express
npm install child_process

Step 4: Create the Node.js server
Create a new JavaScript file (app.js) in your project directory and add the following code to create a simple Express server that can execute a shell script:

const express = require('express');
const { exec } = require('child_process');

const app = express();

app.get('/', (req, res) => {
  const script = './path/to/your/script.sh';

  exec(script, (error, stdout, stderr) => {
    if (error) {
      res.status(500).send(error.message);
      return;
    }

    res.send(stdout);
  });
});

app.listen(3000, () => {
  console.log('Server running on port 3000');
});

Replace ‘./path/to/your/script.sh’ with the path to your shell script.

Step 5: Run the Node.js server
To start the Node.js server, run the following command in your terminal:

node app.js

You should see a message in the terminal saying ‘Server running on port 3000’.

Step 6: Set up AngularJS UI
Now, you can create an AngularJS UI to trigger the execution of the shell script. You can use the $http service to send an HTTP request to the Node.js server. Here’s an example of how you can do this in your AngularJS controller:

app.controller('MainController', ($scope, $http) => {
  $scope.runScript = () => {
    $http.get('http://localhost:3000')
      .then((response) => {
        $scope.output = response.data;
      })
      .catch((error) => {
        console.error(error);
      });
  };
});

In your HTML file, you can create a button to trigger the execution of the shell script:

<!DOCTYPE html>
<html>
<head>
  <title>Execute Shell Script</title>
</head>
<body ng-controller="MainController">
  <button ng-click="runScript()">Run Script</button>
  <p>{{output}}</p>
</body>
</html>

Step 7: Test the application
Open your browser and navigate to http://localhost:3000. Click the ‘Run Script’ button to trigger the execution of the shell script. You should see the output of the script displayed on the page.

Congratulations! You have successfully set up a Node.js server to execute a shell script from an AngularJS UI. This tutorial has shown you how to use Node.js to create a server-side application that interacts with your front-end AngularJS application.