Graficzny monitor łącza w OpenWrt


(jimasek) #1

Wiele osób się zastanawia w jaki sposób są generowane tak ładne wykresy w Tomato czy Gargoyle. Odpowiedz jest prosta JavaScript. Zaletą tego języka skryptowego jest sposób przetwarzania kodu, mianowicie wykonywany jest po stronie klienta, nie wymagający dodatkowych interpreterów. Kolejnym atutem takiego rozwiązania jest odciążenie procesora (w tym przypadku routera) od generowania non stop wykresu w tle.
W tym artykule przedstawię jak stworzyć takie wykresy własnoręcznie w OpenWrt. Wykorzystamy w tym celu projekt Highcharts, który wyposażony jest w bardzo dobrą dokumentację oraz przykłady użycia API.
Instalujemy potrzebne pakiety:

opkg update
opkg install php5-cgi uhttpd ifstat libsqlite3

Pobieramy najnowsze wydanie Highcharts z http://www.highcharts.com/download. Rozpakowujemy archiwum na komputerze i przegrywamy tylko i wyłącznie plik highcharts.src.js z katalogu "js". Wykorzystać możemy do tego WinSCP lub scp linuksowe. Poniżej wykorzystuje scp:
mkdir /www/js
scp highcharts.src.js root@192.168.1.1:/www/js/highcharts.src.js

Plik musi znajdować się w katalogu "js".
Musimy utworzyć jeszcze dwa potrzebne pliki. Pierwszy będący źródłem danych, które to pobierane są narzędziem ifstat ze wskazanego interfejsu sieciowego, drugi będzie wyświetlał nasz wykres.
Przystępujemy więc to utworzenia pierwszego pliku.

cd /www/
wget http://openwrt.pl/dl/sources/js-wykresy/live._php -O live.php

Jedyną zmianę jaką możemy dokonać to ustawienie interfejsu, który będziemy monitorować. W powyższym pliku ustawione jest monitorowanie na interfejsie br-lan, będący mostkiem Wifi oraz przełącznika.
Przystępujemy do utworzenia drugiego pliku:

wget http://openwrt.pl/dl/sources/js-wykresy/live._html -O live.html

Tutaj zmian możemy dokonać naprawdę mnóstwo, z reguły wpłyną one na wygląd naszego wykresu.
Zmianę czestotliwości odświeżania reguluje funkcja:

setTimeout(requestData, 1000);

która jest ustawiona na 1s.
Zmiany wizualne wykresu definjuje obiekt plotOptions. Szczegółowy opis API Highcharts znajduje się na stronie http://www.highcharts.com/ref/.

Pozostaje jeszcze ustawienie poprawne serwera www oraz jego uruchomienie. Dodać musimy interpreter PHP dla uhttpd:

uci set uhttpd.main.interpreter=.php=/usr/bin/php-cgi

Jeżeli instalujemy statystyki na Gargoyle, należy dodatkowo zmienić domyślny port uhttpd na inny, np:. 81

uci set uhttpd.main.listen_http=0.0.0.0:81

Ostatecznie zapisujemy ustawienia i restartujemy serwer WWW

uci commit uhttpd
/etc/init.d/uhttpd restart

Przechodzimy na stronę http://ip-routera/live.html i statystyki interfejsu br-lan powinny już działać. Wykres posiada dwie serie danych Pobieranie i Wysyłanie. Każdą z nich możemy włączać lub wyłączać w przeglądarce.
Źródło: openrouter.info - Artur Wronowski