OpenVPN Status

A web-based application to monitor (multiple) OpenVPN servers.

Features

• WebSocket based real-time events
• Persistent event log
• Full material design
• Multi server support

Pre-requisites

• [x] NodeJS 6 or higher
• [x] npm package manager
• [x] curl

Browser support

Find a list of supported browsers here

Installation

1. Get the source

git clone https://github.com/AuspeXeu/openvpn-status.git

2. Install dependencies

cd openvpn-status
npm install
sudo npm install pm2 -g

Windows

Download curl and unpack the curl.exe in the same folder containing your OpenVPN configuration.

3. Configuration

The configuration is handled in the cfg.json file.

| Option | Default | Description | | -------- |:-------------:| ------------ | | port | 3013 | Port on which the server will be listening. | | bind | 127.0.0.1 | Address to which the server will bind to. Change to 0.0.0.0 to make available on all interfaces. | | servers | [{"id": 0, "name": "Server"}] | Array of servers. | | username | admin | User for basic HTTP authentication. Change to '' or false to disable. | | password | admin | Password for basic HTTP authentication. |

Example:

{
  "port": 3013,
  "bind": "127.0.0.1",
  "servers": [
    {"id": 0, "name": "Server A"},
    {"id": 1, "name": "Server B"}
  ],
  "username": "admin",
  "password": "YV3qSTxD"
}

4. OpenVPN configuration

UNIX

Copy the status.sh file to the folder containing your OpenVPN configuration, e.g., server.conf. Add the following lines to your configuration file. This will intall the client-connect and client-disconnect hooks to provide the data to the web interface.

script-security 2
client-connect ./status.sh
client-disconnect ./status.sh

Make sure the script is executable by the OpenVPN daemon.

[root@server ~]# chmod +x status.sh

Windows

Copy the status.bat file to the folder containing your OpenVPN configuration, e.g., server.conf. Add the following lines to your configuration file. This will intall the client-connect and client-disconnect hooks to provide the data to the web interface.

script-security 2
client-connect status.bat
client-disconnect status.bat

Adjust script variables

And adjust the variables inside status.sh/status.bat to match your configuration.

HOST="127.0.0.1" // Address of the machine running this app,
                 // 127.0.0.1 if the machine also runs the openvpn server
PORT="3013"      // As specified in cfg.json
SERVER="0"       // As specified in cfg.json
USERNAME="admin" // As specified in cfg.json
PASSWORD="admin" // As specified in cfg.json

Restart your OpenVPN server.

5. Build

Before the application is ready to run, the frontend needs to be built. This is done using npm.

npm run build

Run

Manually

node server.js

As service

pm2 start pm2.json
pm2 save

This makes the application available on http://127.0.0.1:3013.

(optional) Running the service behind nginx as a reverse proxy

In order to integrate the service into your webserver you might want to use nginx as a reverse proxy. The following configuration assumes that the port is set to 3013 as it is by default.

server {
  listen 80;
  server_name [domain];

  location / {
    proxy_pass http://127.0.0.1:3013
    proxy_set_header X-Forwarded-Proto $scheme;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
    proxy_read_timeout 86400;
  }
}

Special Thanks To

Maxmind

Maxmind provides all of the IP information used in this project to determine where the VPN connection is connecting from.

GoSquared

GoSquared provides the flag icons for this project. The source for the flag icons can be found here.

Screenshots

Client panel

Event panel