Components

In order to understand how netgrafio works have a look at the following graph:

digraph foo {
   TCPServer [shape = box, style = filled, color = yellow];
   WebSocketServer [shape = box, style = filled, color = yellow];
   FlaskApp [shape = box, style = filled, color = yellow];

   "netgrafio" -> "TCP Socket";
   "netgrafio" -> "Web Socket";
   "netgrafio" -> "Web Application";

   edge [color = red];
   "TCP Socket" -> TCPServer;
   "Web Socket" -> WebSocketServer;
   "Web Application" -> FlaskApp;

   edge [color = green];
   TCPServer -> "lib/TCPServer.py";
   WebSocketServer -> "lib/WebSocketServer.py";
   FlaskApp -> "lib/WebServer.py";
   FlaskApp -> "web/FlaskApp.py";
   FlaskApp -> "web/core/*";
   FlaskApp -> "web/mod_*/*"
}

Quickstart

Make sure you have installed all the requirements on your system (specified in README.md). Afterwards you can clone this project:

$ git clone https://github.com/nullsecuritynet/netgrafio
$ cd netgrafio

Now you’ll need to setup a isolated python environment using virtualenv:

$ virtualenv env
Using base prefix '/usr'
New python executable in env/bin/python3
Also creating executable in env/bin/python
Installing setuptools, pip...done.

Make sure to activate the virtual environment:

$ source env/bin/activate

Having set the virtualenv environment let’s install some missing packages:

$ pip install -r env/requirements.pip

Now you’re ready to start netgrafion and have some fun.

These are the basic parameters:

$ python netgrafio.py -h
usage: netgrafio.py [-h] [--tcp-port TCP_PORT] [--ws-port WS_PORT]
                    [--web-port WEB_PORT] [--host HOST]

netgrafio - visualize your network

optional arguments:
  -h, --help           show this help message and exit
  --tcp-port TCP_PORT  Specify TCP port to listen for JSON packets (default:
                       8081)
  --ws-port WS_PORT    Specify WebSocket port to send JSON data to (default:
                       8080)
  --web-port WEB_PORT  Specify web port to server web application (default:
                       5000)
  --host HOST          Specify host to bind socket on (default: 127.0.0.1)

If you start netgrafio without any arguments, then you’ll have a

  • TCP-Socket listening on port 8081
  • WebSocket listening on port 8080
  • Web-Application available at http://localhost:5000

After starting netgrafio:

$ python netgrafio.py
2014-04-24 16:18:12,984 - INFO - [WebSocketServer] - Starting WebSocket server on port 8080
2014-04-24 16:18:12,984 - INFO - [WebSocketServer] - Start collector server
2014-04-24 16:18:12,985 - INFO - [WebSocketServer] - Waiting for incoming data ...
2014-04-24 16:18:12,989 - INFO - [WebServer] - Listening on 5000
2014-04-24 16:18:12,989 - INFO - [TCPServer] - Listening on 8081

Now open your browser and navigate to http://localhost:5000

D3 Graph

This section describes the basic API of d3.graph.min.js. It describes how to build a graph using D3.

class D3Graph(container)

Create a new D3 graph.

Arguments:
  • container (string) – Specify the element in the DOM where to show the graph
Returns:

Instance of class D3Graph (SVG element)

Example:

myGraph = new D3Graph("#myElement");
D3Graph.init()

Initialize the graph.

Example:

myGraph.init()
D3Graph.start()

Start the graph.

Example:

myGraph.start()
class D3GraphController(d3graph)

Control the D3 graph.

Arguments:
  • d3graph (D3Graph) – Object of type D3Graph.
Returns:

Instance of class D3GraphController

Example:

myGraph = new D3Graph("#myElement");
graphController = new D3GraphController(myGraph);
D3GraphController.addNode(nodeObject)

Add new node to the graph.

Arguments:
  • nodeObject (object) – Node object to be added to the graph

Example:

nodeObject = {
    "id": "some_unique_id"
   ,"class": "blue"
   ,"name": "This is my fancy name"
};

graphController.addNode(nodeObject);
D3GraphController.findNode(id)

Find node by ID.

Arguments:
  • id (number) – ID of node to look up.
Returns:

If found the node object is returned.

Add new link between 2 nodes.

Arguments:
  • linkObject (object) – Link object

Example:

// Add nodes
nodeObjectA = {
    "id": "A"
   ,"class": "A"
   ,"name": "B"
};

nodeObjectB = {
    "id": "B"
   ,"class": "B"
   ,"name": "B"
};


// Add link
var linkObject = {
    "source": nodeObjectA.id,
    "target": nodeObjectB.id,
    "linkclass": "dotted"
}

graphController.addNode(nodeObjectA);
graphController.addNode(nodeObjectB);
graphController.addLink(linkObject);

Find link by link object.

Arguments:
  • linkObject (object) – Should contain source and target
Returns:

If found the link object is returned.

Example:

nodeObjectA = {"id": "A"}
nodeObjectB = {"id": "B"}
...
var linkObject = {"source": nodeObjectA, "target": nodeObjectB}
searched_link = findLink(linkObject)
...
D3GraphController.getNodes()

Get array of nodes.

Returns:Array containing all node objects

Get array of links.

Returns:Array containing all link objects
D3GraphController.update()

Update graph. Wrapper for D3Graph.update().

D3GraphController.start()

Start graph. Wrapper for D3Graph.start().

TCPServer

class lib.TCPServer.JSONServer(host, port, in_queue=<queue.Queue object at 0x7f4b3528d9b0>)

TCP Server waiting for JSON packets

start()

Starts JSON server

class lib.TCPServer.TCPServer(server_address, RequestHandlerClass, in_queue=<queue.Queue object at 0x7f4b35241dd8>)

Custom TCP server

class lib.TCPServer.TCPServerHandler(request, client_address, server)

Waiting for incoming (JSON) data

handle()

Wait for incoming JSON packets and pre-process them

process_data(data)

Process received data

Args:
data(bytes): Incoming data

WebSocketServer

class lib.WebSocketServer.Application

Tornado application

class lib.WebSocketServer.IndexPageHandler(application, request, **kwargs)

Default index page handler. Not implemented yet.

class lib.WebSocketServer.WebSocketHandler(application, request, **kwargs)

Handle default WebSocket connections

on_close()

Connection was closed

on_message(message)

Data income event callback

open()

New connection has been established

class lib.WebSocketServer.WebSocketServer(host, port, in_queue=<queue.Queue object at 0x7f4b352244e0>)

Create tornado HTTP server serving our application

Note

Uses tornado as backend.

collect_data()

Wait for data in individual thread

collector_process_data(data)

Process incoming data and send it to all available clients

Args:
data: Received data
start()

Starts the server

Note

The server will listen for incoming JSON packets and pass them to all clients connected to the WebSocket.

start_collector()

Starts collecting packages

start_server()

Starts the HTTP server

WebServer

class lib.WebServer.Application

Create new Flask application using Tornado’s WSGIContainer

class lib.WebServer.HTTPServer(host, port)

Simple http server using Tornado

start_server()

Server will start a new thread and listen for incoming connections

class lib.WebServer.HelloHandler(application, request, **kwargs)

Dummy request handler

class lib.WebServer.WebServer(host, port)

Web server for main application

start()

Starts the web server in own thread

Flask application

class web.FlaskApp.FlaskApp

Use Flask for better routes and temlating handling

Screenshots

_images/netgrafio_mod_traceroute.png

Do a traceroute using netgrafio

_images/netgrafio_mod_analysis.png

Analyze your network traffic (LIVE!)

_images/netgrafio_mod_nmap.png

Visualize your NMap scanning results

Indices and tables

Table Of Contents

Next topic

web package

This Page