[NP] Reportes personalizados de PRTG mediante el API utilizando HTML y JS |

Resumen

PRTG cuenta con un API que permite tanto leer como escribir en el sistema de PRTG. Este API funciona mediante solicitudes HTTP GET. Las URL consisten en una ruta de acceso a la función API y algunos parámetros que se envían mediante la URL. Muchas veces es necesario que se incluya el username y la contraseña de este para poder realizar cambios como escritura o si se desea extraer información. Por cuestiones de seguridad se recomienda utilizar el Passhash de usuario en vez de la contraseña, ya que estos datos son visibles mediante el link.

Para mostrar esta información mediante HTML se hace uso de las etiquetas iframe las cuales permiten mostrar contenido como gráficos, tablas de datos o reportes.

Detalles

Para realizar reportes personalizados es necesario modificar una serie de archivos, ya que esto permitirá que solo se muestre cierta información necesaria sin afectar los archivos originales de PRTG.

Gráfico externo con función de ZOOM:

graphzoom.htm: este archivo lo podemos encontrar en la dirección donde se instalo nuestro PRTG, dentro de la carpeta webroot, una vez encontrado clonar este archivo, realizar un respaldo y cambiar el nombre del mismo. Entre las principales modificaciones que de deben de realizar a este archivo están:
- Nombre del archivo pagefooter.htm: este archivo se incluye en los includes del archivo, y este agrega el footer al gráfico. la modificación de este archivo es necesaria solo en el caso que se desee omitir información como el logo de PRTG, fecha, hora, entre otros. La modificación que se debe de realizar a este archivo se detalla en pasos posteriores, se debe de tomar en cuenta que el nombre que se le asigne al archivo modificado sera utilizado para incluirlo en el archivo clon graphzoom.htm.
El URL que compone este gráfico es el siguiente y los parámetros que se deben incluir serian los siguientes:
http://<dirección del servidor>/<archivo clon de graphzoom>.htm?id=<id del sensor>&graphid=<tipo de grafico>&clgid=&dynamicgraph=1&username=<cuenta de usuario>&passhash=<passhash de la cuenta de usuario>

Un ejemplo de este URL seria el siguiente:
http://192.168.10.27/grafico_zoom.htm?id=2225&graphid=0&clgid=&dynamicgraph=1&username=read&passhash=3769378938

Principales parametros del enlace:

Dirección del servidor:
- Dirección URL del servidor donde se encuentra instalado el servidor de PRTG.
- Dirección IP donde se cuentra instalado el servidor de PRTG, de ser necesario indicar el puerto.
Tipo de grafico:
- 0: Gráfico en vivo de las ultimas 2 horas.
- 1: Gráfico de dos días.
- 2: Gráfico de 30 días.
- 3: Gráfico de 365 días.
y con esto se obtiene un gráfico similar al siguiente:
pagefooter.htm: este archivo lo podemos encontrar en la siguiente ruta, ruta de instalación de PRTG/webroot/includes. Una vez encontrado el archivo, como el archivo anterior lo clonamos y cambiamos el nombre del mismo. lo abrimos con el editor de texto de preferencia y realizar los siguientes pasos:
- Localizar el div con la clase footer.
- En este div se pueden modificar u ocultar datos como: logo de PRTG, versión de PRTG, derechos reservados de PRTG, nombre de usuario, hora y fecha del servidor. El código que realiza esto es similar al de la siguiente imagen, en caso de querer ocultar alguna solo sera necesario eliminar el código.
  Codigo HTML que forma el footer
- Una vez hechas las modificaciones guardar el archivo en la misma ruta donde se encuentra el archivo original.

Datos históricos con gráfico y tabla de datos

historicdata.htm: este archivo lo podemos encontrar en la ruta de instalación de PRTG/webroot. este archivo nos permitirá generar datos históricos, pero ademas si se realizara algo similar a los otros archivos (clonarlos y editarlos) se podría modificar el reporte con el fin de mostrar solo la información que se crea útil o necesaria. A continuación se detalla cada sección del reporte y el código que lo genera, ademas del URL que genera los datos históricos.
- Tabla de datos principales
  El código que forma esta tabla de datos principal se compone del siguiente fragmento.
  Mediante el código anterior es que se obtiene el resultado de dichos datos históricos. Se pueden eliminar filas de la tabla con el fin de eliminar u ocultar información que se considere irrelevante.
- Gráfico
  A pesar de que el grafico es generado dinamicamente se puede decir que no se puede realizar ningun cambio dentro de el, a no ser su titulo que mas adelante se detalla como realizar esto.
  
  El grafico que se muestra en el reporte sera similar al siguiente.
- Tabla de datos detallada
  Esta tabla detallada no es posible el poder modificarse debido a la forma en la que se crea la misma.
  
  La tabla de datos detallada se muestra de la siguiente manera
- Historial de estado de sensor
  Mediante el siguiente código HTML se genera la tabla que muestra el historial de estado del sensor, ademas este segmento de código puede ser eliminado en el caso que se desee omitir esta información.
  
  El historial de estado del sensor se muestra de la siguiente manera
- Información de pie de pagina
  Esta es la información que se encuentra al final del reporte, a como algunas de las anteriores, esta se puede omitir o modificar según sea necesario mediante el siguiente código.
  Y en el reporte se visualiza se la siguiente manera
- Link mediante el cual se genera el reporte y los principales parametros
  El enlace y los principales parámetros que se utilizan para la generación de estos gráficos es el siguiente http://<dirección del servidor>/archivo clon de historicdata_htm.htm?id=<id del sensor>&sdate=<fecha inicial de informe en formato yyyy/mm/dd/hh/mm/ss>&edate=<fecha final de informe en formato yyyy/mm/dd/hh/mm/ss>&avg=<promedio de tiempo en segundos>&pctavg=300&pctshow=false&pct=95&pctmode=false&hide=NaN&username=<cuenta de usuario>&passhash=<passhash de la cuenta de usuario>
  Un ejemplo de como se veria este enlace seria se la siguiente manera
  http://10.30.0.27/datos_historicos.htm?id=2225&sdate=2017-04-28-00-00-00&edate=2017-04-28-23-59-59&avg=3600&pctavg=300&pctshow=false&pct=95&pctmode=false&hide=NaN&username=read&passhash=3769378938