Ways of Getting Active Notifications to a Mac—Application

Now that you understand about active notifications and how they work, this second tutorial will show you how to apply that knowledge. I'll show two ways of working with active notifications using a Node.js server. This same approach can easily be applied to other server types.

Active Notifications Using the DDNS

The download file for this tutorial contains the code for a small, Express.js web server that can be run on a Virtual Private Server or VPS. I have an account with FilpHost that I use for my Custom Computer Tools website. Just upload these files to a VPS, install Node.js, and run a command in the directory:

1	npm install

This will install all the needed libraries for Express.js and Pug template engine. Most of the files in this directory are supporting files for the server. The support files display a web page that has a single button. Clicking the button will send a notification to the server to ping my home computer. The main files of interest are the two types of server files: freeddns-Router.js and local-Router.js.

The server file for referring to the home computer through a DDNS, freeddns-Router.js, contains this code:

//
// Load the libraries used.
//
var express = require("express");
var http = require("http");

//
// Setup the applicaiton variables.
//
var app = express();
var port = 3030;
var data = {
    title: "Notification Server Main Page",
    app: "Notification Server"
};
var homeComputer = "http://customct.freeddns.org:4490/action.html?macro=998C71BC-00CE-42B1-9478-306AA747A86A&value=Notice+from+";

//
// Setup the Express routes.
//
app.use(express.static("static"));
app.set("views", "./views")
app.set("view engine", "pug")

//
// Handle the Home page. This gives the client
// a button to press to send a notification. This
// will render the PEG template in the "views"
// directory.
//
app.get("/", function (req, res) {
  res.render("index",data);
});

//
// Handle the request from the client to send
// the home computer a notification.
//
app.get("/api/notifyOwner", function(req,res) {
    //
    // Quickly reply to the client.
    //
    res.send("okay");

    //
    // Get the IP of the client.
    //
    var ip = req.ip || req.connection.remote;
    ip = ip.split(":")[3];

    //
    // Send the client IP to the home computer using
    // Keyboard Maestro"s Web interface.
    //
    http.get(homeComputer + ip, (res) => {
        console.log(`Got response: ${res.statusCode}`);
        // consume response body
        res.resume();
    }).on("error", (e) => {
        console.log(`Got error: ${e.message}`);
    });
});

//
// Start the server listening to the http port specified.
//
app.listen(port, function () {
  console.log("Notification Server listening on port ' + port + "!");
});

You will need to edit line 16 to match your particular DDNS setup. Lines 35–62 defines the route /api/notifyOwner that the client’s browser will call to send a notification to the home computer.

The link for the home computer, in the homeComputer variable, calls port 4490 on the domain name for the home computer. This is the default port setup for Keyboard Maestro’s Personal Web Server.

The rest of the link, /action.html?macro=998C71BC-00CE-42B1-9478-306AA747A86A&value=Notice+from+, gets the action.html page on the server for Keyboard Maestro with the variables macro and value. The macro variable contains the unique identification code for the macro in Keyboard Maestro.

The value variable contains whatever you want to send to the macro that is URL encoded. The information in the value variable is in the %TriggerValue% variable for the Keyboard Maestro script to use.

Keyboard Maestro Macro for Recieving Notifications

Now, install the Keyboard Maestro macro that is in the download file for this tutorial. This macro will display the %TriggerValue% to the user. The server code sends the IP of the client that pressed the button on the web site.

Keyboard Maestro Preferences Web Server — Keyboard Maestro Preferences: Web Server

Next, open the Keyboard Maestro preferences and click on the Web Server option at the top. Set the options to the following values: Web Server Enabled checked, HTTP Port set to 4490, and Web Browser Access Enabled checked.

Keyboard Maestros Web Server — Keyboard Maestro’s Web Server

If you open your web browser to http://localhost:4490, you will see the Keyboard Maesto’s web server page. If the macro you loaded from the download is the only macro you have that triggers from the web server, it will show up in the Public Macro list.

If it isn’t showing, click on the drop down menu and select the Test macro. Type This is a test in the Value area and press the Execute button.

Keyboard Maestros Web Server Macro executed — Keyboard Maestro’s Web Server: Macro executed

You'll see the notification displayed with the text Testing: This is a test. The link that now shows in the address bar of the browser should have the same macro value as the link in the server script on line 16. If not, change the script to match this value.

Testing on the VPS

Once you have the server software uploaded, libraries installed, edits made to the server program, and the Keyboard Maestro macro loaded and setup, you can then test.

To start the server on your VPS, type the following:

1	node freeddns-Router.js

Then navigate to the server's address at port 3030.

Notification Servers Main Page — Notification Server’s Main Page

You should see the bare minimum web page with the button to press for sending the notification.

Notification Server with Sent Notification

When you press the notice button, you should get the alert dialog telling you the server recieved the notification okay. Then the Display Text notice from Keyboard Maestro should show the IP address of the client that sent the notification.

Since I live in Thailand and my VPS is in the United States, the message went from my browser in Thailand, to the VPS in the United States, and then back to my system in Thailand all within one minute.

'Roll Your Own' Active Notifications

If you do not want to use a DDNS, you can create your own version with your server. The local-Router.js file is the exact same router code as freeddns-Router.js, but has one new route: /api/homecomputer.

It also has a new global variable homeComputerIP that will store the IP address of the system that calls it.

//
// Load the libraries used.
//
var express = require("express");
var http = require("http");

//
// Setup the applicaiton variables.
//
var app = express();
var port = 3030;
var data = {
    title: "Notification Server Main Page",
    app: "Notification Server"
};
var homeComputerPortLink = ":4490/action.html?macro=998C71BC-00CE-42B1-9478-306AA747A86A&value=Notice+from+";
var homeComputerIP = "";

//
// Setup the Express routes.
//
app.use(express.static("static"));
app.set("views", "./views")
app.set("view engine", "pug")

//
// Handle the Home page. This gives the client
// a button to press to send a notification. This
// will render the PEG template in the "views"
// directory.
//
app.get("/", function (req, res) {
  res.render("index",data);
});

//
// Handle the request from the client to send
// the home computer a notification.
//
app.get("/api/notifyOwner", function(req,res) {
    //
    // Quickly reply to the client.
    //
    res.send("okay");

    //
    // Get the IP of the client.
    //
    var ip = req.ip || req.connection.remote;
    ip = ip.split(":")[3];

    //
    // Send the client IP to the home computer using
    // Keyboard Maestro"s Web interface.
    //
    http.get("http://" + homeComputerIP + homeComputerPortLink + ip, (res) => {
        console.log(`Got response: ${res.statusCode}`);
        // consume response body
        res.resume();
    }).on("error", (e) => {
        console.log(`Got error: ${e.message}`);
    });
});

app.get("/api/homecomputer", function(req,res) {
    //
    // Quickly reply to the client.
    //
    res.send("okay");

    //
    // Get the IP of the client.
    //
    homeComputerIP = req.ip || req.connection.remote;
    homeComputerIP = homeComputerIP.split(":")[3];
    console.log("Home computer IP is " + homeComputerIP);
});

//
// Start the server listening to the http port specified.
//
app.listen(port, function () {
  console.log("Notification Server listening on port ' + port + "!");
});

Lines 65–77 manages this new route. When you open that route in your web browser, you will get back a plain text okay. But, the server will save your IP address and use it as the IP address to send the notification.

This cuts out the DDNS middleman and just ships the notification straight to your computer.

To run this server, type the following line:

1	node local-Router.js

In order for this to work well, you will have to either go to the address for setting the IP address each time you connect to the internet, or run a background task that does that for you.

Clockwise is a great application for making scripts that periodically run. I have a Clockwise tutorial, on Envato Tuts+, that you may wish to consult.

Keyboard Maestro Macro for Periodically Setting IP Address on Server

The download file also has the above Keyboard Maestro macro for periodically calling the server to set the IP address.

Since Keyboard Maestro doesn’t have an Internet reset trigger, a periodical trigger is the next best thing. You will have to modify the script to reference your VPS.

Security

Since this tutorial is about getting an active notification to your local computer, I did not add anything to address security. These small servers are currently insecure.

If you use these in the wild, I strongly suggest creating some type of security for identification of the client that sets the IP address.

You can create a password system or a token passing system that is secure, but these ideas are beyond the scope of this tutorial.

Conclusion

Now that you know how active notifications work, create your own system. The ideas here are easily translated to PHP, Ruby, or Python. You can also expand the Keyboard Maestro macro to process the incoming information.

I have it setup to call an Alfred workflow to count visits to my website. You could use this to notify if someone needs help on a website as well. The possibilities are only bounded by your imagination.