Микропроект веб-интерфейса для просмотра состояния портов коммутатора. Предполагается использование PHP и SNMP
SNMP (англ. Simple Network Management Protocol — простой протокол сетевого управления)
протокола для опроса состояния коммутатора. Опрос порта происходит в реальном времени при клике на изображение соответствующего порта. Изображения взяты из оригинального Web-интерфейса коммутатора Cisco Small Business SG200-26.

Для работы данного примера на сервере IIS необходимо включить расширение php_snmp.dll:

[PHP_SNMP]
extension=php_snmp.dll

Также необходимо добавить MIB файлы по пути в переменную PATH или в каталог по умолчанию (в моем случае это - с:\usr\share\snmp\mibs). MIB файлы можно взять в пакете Net-SNMP package.

Интерфейс

Коммутатор: Cisco SG 200-26 26-Port Gigabit Smart Switch
Обновить

GE1GE13GE2GE14GE3GE15GE4GE16GE5GE17GE6GE18GE7GE19GE8GE20GE9GE21GE10GE22GE11GE23GE12GE24GE25GE26GE25GE26
Детально

Исходники

index.html 
```html

<style>
.smallPortArea200 {
  position:absolute;
  visibility: visible;
  cursor: pointer;
  height: 23px;
  width: 22px;
}
.smallExtraPortArea52 {
  position:absolute;
  visibility: visible;
  cursor: pointer;
  height: 22px;
  width: 28px;
}
.smallFiberPortArea28 {
  position:absolute;
  visibility: visible;
  cursor: pointer;
  height: 22px;
  width: 25px;
}
#chassisDiv img {
  vertical-align: unset;
}
</style>



<script src="/assets/js/jquery.min.js"></script>
<script type="text/javascript">
var swModel = "sg200-26";


function refreshAllState() {
  
  for (var i = 49; i < 75; i++) {
    clickOnActivePort(i);
  }

  $('#port-details').load('/examples/cisco-switch/get-snmp-system-descr.php');

}

function clickOnActivePort(port) {
  var numPort = 0;
  var sw_port = "";

  if (swModel == "sg200-26") {
    numPort = port - 48;
    sw_port = port;
  }

  var json_url = '/examples/cisco-switch/get-snmp-port-status.php?port=' + sw_port;

  $.getJSON(json_url, function (data) {
      var strTitle = data.Description + "\n" + data.Label + "\n" + data.Status + "\n" + data.Speed + "\n" +  data.Duplex;
      $('#img_reg_' + port ).attr({
          "title" : strTitle
      });
      $('#port-details').html(strTitle);

      if (numPort < 13) {
        if (data.Status == "up(1)") {
          if (data.Speed == "1000 Mbps") {
            $('#img_reg_' + port).attr('src', '/assets/images/cisco/port_small_upper_both.gif');
          } else {
            $('#img_reg_' + port).attr('src', '/assets/images/cisco/port_small_upper_green.gif');
          }
        } else {
            $('#img_reg_' + port).attr('src', '/assets/images/cisco/port_small_upper_off.gif');
        }
      } else if (numPort == 25) {
        if (data.Status == "up(1)") {
          if (data.Speed == "1000 Mbps") {
            $('#img_ext_' + port).attr('src', '/assets/images/cisco/port_small_extra_upper_both.gif');
            $('#img_fib_' + port).attr('src', '/assets/images/cisco/port_small_fiber_upper_both.gif');

          } else {
            $('#img_ext_' + port).attr('src', '/assets/images/cisco/port_small_extra_upper_green.gif');
            $('#img_fib_' + port).attr('src', '/assets/images/cisco/port_small_fiber_upper_green.gif');
          }
        } else {
            $('#img_reg_' + port).attr('src', '/assets/images/cisco/port_small_extra_upper_off.gif');
            $('#img_fib_' + port).attr('src', '/assets/images/cisco/port_small_fiber_upper_off.gif');
        }
      } else if (numPort == 26) {
        if (data.Status == "up(1)") {
          if (data.Speed == "1000 Mbps") {
            $('#img_ext_' + port).attr('src', '/assets/images/cisco/port_small_extra_downer_both.gif');
            $('#img_fib_' + port).attr('src', '/assets/images/cisco/port_small_fiber_downer_both.gif');

          } else {
            $('#img_ext_' + port).attr('src', '/assets/images/cisco/port_small_extra_downer_green.gif');
            $('#img_fib_' + port).attr('src', '/assets/images/cisco/port_small_fiber_downer_green.gif');
          }
        } else {
            $('#img_reg_' + port).attr('src', '/assets/images/cisco/port_small_extra_downer_off.gif');
            $('#img_fib_' + port).attr('src', '/assets/images/cisco/port_small_fiber_downer_off.gif');
        }
      } else {
        if (data.Status == "up(1)") {
          if (data.Speed == "1000 Mbps") {
            $('#img_reg_' + port).attr('src', '/assets/images/cisco/port_small_downer_both.gif');
          } else {
            $('#img_reg_' + port).attr('src', '/assets/images/cisco/port_small_downer_green.gif');
          }
        } else {
            $('#img_reg_' + port).attr('src', '/assets/images/cisco/port_small_downer_off.gif');
        }

      }
  }); //// End getJSON
}
</script>



<div id="chassisHolderDiv" style="width: 720px;">
  <div id="chassisDiv" style="position: relative;">
    <table width="100%">
      <tbody>
        <tr>
          <td>
            <img id="imgPanel_1" style="position:absolute;top:23px;left:0px;" name="zoomElement" src="/assets/images/cisco/SG200-26.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_49" style="top: 37px; left: 327px;" alt="GE1" onclick="clickOnActivePort(49)" title="GE1" src="/assets/images/cisco/port_small_upper_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_61" style="top: 59px; left: 327px;" alt="GE13" onclick="clickOnActivePort(61)" title="GE13" src="/assets/images/cisco/port_small_downer_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_50" style="top: 37px; left: 351px;" alt="GE2" onclick="clickOnActivePort(50)" title="GE2" src="/assets/images/cisco/port_small_upper_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_62" style="top: 59px; left: 351px;" alt="GE14" onclick="clickOnActivePort(62)" title="GE14" src="/assets/images/cisco/port_small_downer_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_51" style="top: 37px; left: 374px;" alt="GE3" onclick="clickOnActivePort(51)" title="GE3" src="/assets/images/cisco/port_small_upper_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_63" style="top: 59px; left: 374px;" alt="GE15" onclick="clickOnActivePort(63)" title="GE15" src="/assets/images/cisco/port_small_downer_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_52" style="top: 37px; left: 398px;" alt="GE4" onclick="clickOnActivePort(52)" title="GE4" src="/assets/images/cisco/port_small_upper_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_64" style="top: 59px; left: 398px;" alt="GE16" onclick="clickOnActivePort(64)" title="GE16" src="/assets/images/cisco/port_small_downer_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_53" style="top: 37px; left: 422px;" alt="GE5" onclick="clickOnActivePort(53)" title="GE5" src="/assets/images/cisco/port_small_upper_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_65" style="top: 59px; left: 422px;" alt="GE17" onclick="clickOnActivePort(65)" title="GE17" src="/assets/images/cisco/port_small_downer_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_54" style="top: 37px; left: 445px;" alt="GE6" onclick="clickOnActivePort(54)" title="GE6" src="/assets/images/cisco/port_small_upper_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_66" style="top: 59px; left: 445px;" alt="GE18" onclick="clickOnActivePort(66)" title="GE18" src="/assets/images/cisco/port_small_downer_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_55" style="top: 37px; left: 471px;" alt="GE7" onclick="clickOnActivePort(55)" title="GE7" src="/assets/images/cisco/port_small_upper_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_67" style="top: 59px; left: 471px;" alt="GE19" onclick="clickOnActivePort(67)" title="GE19" src="/assets/images/cisco/port_small_downer_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_56" style="top: 37px; left: 495px;" alt="GE8" onclick="clickOnActivePort(56)" title="GE8" src="/assets/images/cisco/port_small_upper_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_68" style="top: 59px; left: 495px;" alt="GE20" onclick="clickOnActivePort(68)" title="GE20" src="/assets/images/cisco/port_small_downer_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_57" style="top: 37px; left: 519px;" alt="GE9" onclick="clickOnActivePort(57)" title="GE9" src="/assets/images/cisco/port_small_upper_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_69" style="top: 59px; left: 519px;" alt="GE21" onclick="clickOnActivePort(69)" title="GE21" src="/assets/images/cisco/port_small_downer_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_58" style="top: 37px; left: 542px;" alt="GE10" onclick="clickOnActivePort(58)" title="GE10" src="/assets/images/cisco/port_small_upper_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_70" style="top: 59px; left: 542px;" alt="GE22" onclick="clickOnActivePort(70)" title="GE22" src="/assets/images/cisco/port_small_downer_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_59" style="top: 37px; left: 566px;" alt="GE11" onclick="clickOnActivePort(59)" title="GE11" src="/assets/images/cisco/port_small_upper_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_71" style="top: 59px; left: 566px;" alt="GE23" onclick="clickOnActivePort(71)" title="GE23" src="/assets/images/cisco/port_small_downer_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_60" style="top: 37px; left: 590px;" alt="GE12" onclick="clickOnActivePort(60)" title="GE12" src="/assets/images/cisco/port_small_upper_off.gif">
            <img class="smallPortArea200" name="zoomElement" id="img_reg_72" style="top: 59px; left: 590px;" alt="GE24" onclick="clickOnActivePort(72)" title="GE24" src="/assets/images/cisco/port_small_downer_off.gif">
            <img class="smallExtraPortArea52" name="zoomElement" id="img_ext_73" style="top: 38px; left: 651px;" alt="GE25" onclick="clickOnActivePort(73)" title="GE25" src="/assets/images/cisco/port_small_extra_upper_off.gif">
            <img class="smallExtraPortArea52" name="zoomElement" id="img_ext_74" style="top: 60px; left: 651px;" alt="GE26" onclick="clickOnActivePort(74)" title="GE26" src="/assets/images/cisco/port_small_extra_downer_off.gif">
            <img class="smallFiberPortArea28" name="zoomElement" id="img_fib_73" style="top: 38px; left: 685px;" alt="GE25" onclick="clickOnActivePort(73)" title="GE25" src="/assets/images/cisco/port_small_fiber_upper_off.gif">
            <img class="smallFiberPortArea28" name="zoomElement" id="img_fib_74" style="top: 59px; left: 685px;" alt="GE26" onclick="clickOnActivePort(74)" title="GE26" src="/assets/images/cisco/port_small_fiber_downer_off.gif">
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</div>

<h5>Детально</h5>
<pre style="background-color: #C0D5D5; height: auto;">
  <code>
    <div id="port-details"></div>
  </code>
</pre>

```
get-snmp-port-status.php 
```php

<?php
    $sw_port = "1";
    $sw_addr = "192.168.1.253";
    $sw_community = "public";

    if (!empty($_GET['port'])) {
        $sw_port = (trim($_GET['port']));
    }

    if (!empty($_GET['sw'])) {
        $sw_addr = (trim($_GET['sw']));
    }


    $session = new SNMP(SNMP::VERSION_1, $sw_addr, $sw_community);

    $str_oid_port_descr = "IF-MIB::ifDescr." . $sw_port;
    $get_oid_port_descr = $session->get($str_oid_port_descr);
    list ($oid_format_descr , $oid_value_descr) = split (': ' , $get_oid_port_descr);

    //// Interface Label
    $str_oid_port_label = ".1.3.6.1.2.1.31.1.1.1.18." . $sw_port;
    $get_oid_port_label = $session->get($str_oid_port_label);
    list ($oid_format_label , $oid_value_label) = split (': ' , $get_oid_port_label);

    //// Interface Status
    $str_oid_port_status = ".1.3.6.1.2.1.2.2.1.8." . $sw_port;
    $get_oid_port_status = $session->get($str_oid_port_status);
    list ($oid_format_status , $oid_value_status) = split (': ' , $get_oid_port_status);

    //// Interface Speed
    $str_oid_port_speed = ".1.3.6.1.2.1.2.2.1.5." . $sw_port;
    $get_oid_port_speed = $session->get($str_oid_port_speed);
    list ($oid_format_speed , $oid_value_speed) = split (': ' , $get_oid_port_speed);
    $oid_value_speed = ($oid_value_speed / 1000000)." Mbps";

    //// Interface Duplex
    $str_oid_port_duplex = "EtherLike-MIB::dot3StatsDuplexStatus." . $sw_port;
    $get_oid_port_duplex = $session->get($str_oid_port_duplex);
    list ($oid_format_duplex , $oid_value_duplex) = split (': ' , $get_oid_port_duplex);

    $json_port_out = '
{
    "Description": "'.$oid_value_descr.'",
    "Label": "'.$oid_value_label.'",
    "Status": "'.$oid_value_status.'",
    "Speed": "'.$oid_value_speed.'",
    "Duplex": "'.$oid_value_duplex.'"
}';

    echo $json_port_out;
?>

```
get-snmp-system-descr.php 
```php

<?php
    $sw_addr = "192.168.1.253";
    $sw_community = "public";

    if (!empty($_GET['sw'])) {
        $sw_addr = (trim($_GET['sw']));
    }

    $session = new SNMP(SNMP::VERSION_1, $sw_addr, $sw_community);

    $str_oid_system_descr = ".1.3.6.1.2.1.1.1.0";
    $get_oid_system_descr = $session->get($str_oid_system_descr);
    list ($oid_format_descr , $oid_value_descr) = split (': ' , $get_oid_system_descr);

    $session->valueretrieval = SNMP_VALUE_PLAIN;
    $ifDescr = $session->walk(".1.3.6.1.2.1.2.2.1.2", TRUE);
    $session->valueretrieval = SNMP_VALUE_LIBRARY;
    $ifType = $session->walk(".1.3.6.1.2.1.2.2.1.3", TRUE);
    $result = array();

    $jsonOut = '{ "SystemDescription": "'.$oid_value_descr.'", "ListOfInterfaces": [{';
    foreach($ifDescr as $i => $n) {
        $jsonOut = $jsonOut.'"'.$i.'": "'.$n.'", ';
        $result[$n] = $ifType[$i];
    }
    $jsonOut = $jsonOut.'}]}';

    echo $jsonOut;
?>

```

Полезные OID

  • .1.3.6.1.2.1.1.5.0 - sysName
  • .1.3.6.1.2.1.1.1.0 - sysDescr
  • .1.3.6.1.2.1.1.4.0 - sysContact
  • .1.3.6.1.2.1.1.6.0 - sysLocation
  • .1.3.6.1.2.1.2.1.0 - число интерфейсов
  • .1.3.6.1.2.1.2.2.1.2.i - описание интерфейса i
  • .1.3.6.1.2.1.2.2.1.3.i - тип интерфейса i
  • .1.3.6.1.2.1.2.2.1.1.i - ifIndex
  • .1.3.6.1.2.1.2.2.1.14.i - ifInErrors
  • .1.3.6.1.2.1.2.2.1.20.i - ifOutErrors
  • .1.3.6.1.2.1.2.2.1.10.i - ifInOctets
  • .1.3.6.1.2.1.2.2.1.16.i - ifOutOctets
  • .1.3.6.1.2.1.2.2.1.13.i - ifInDiscards
  • .1.3.6.1.2.1.2.2.1.19.i - ifOutDiscards
  • .1.3.6.1.2.1.2.2.1.11.i - ifInUcastPkts inbound unicast pkts
  • .1.3.6.1.2.1.2.2.1.17.i - ifOutUcastPkts
  • .1.3.6.1.2.1.2.2.1.12.i - ifInNUcastPkts inbound nonunicast pkts
  • .1.3.6.1.2.1.2.2.1.18.i - ifOutNUcastPkts
  • .1.3.6.1.2.1.2.2.1.15.i - ifInUnknownProtos
  • .1.3.6.1.2.1.2.2.1.21.i - ifOutQLen
  • .1.3.6.1.2.1.2.2.1.5.i - ifSpeed
  • .1.3.6.1.2.1.2.2.1.8.i - ifOperStatus (up(1), down(2), testing(3))
  • .1.3.6.1.2.1.2.2.1.7.i - ifAdminStatus (up(1), down(2), testing(3))
  • .1.3.6.1.2.1.2.2.1.8.i - ifOperHack (up(1), 0)
  • .1.3.6.1.2.1.2.2.1.7.i - ifAdminHack (up(1), 0)

Ссылки