Table of Contents
19 Itens de navegador
Visão geral
Os items de navegador permitem monitorar sites e aplicações web complexas usando um navegador.
O suporte a items de navegador é atualmente experimental.
Os items de navegador coletam dados executando um código JavaScript definido pelo usuário e recuperando dados via HTTP/HTTPS. Este item pode simular ações relacionadas ao navegador, como clicar, inserir texto, navegar por páginas da web e outras interações do usuário com sites ou aplicações web.
Além do script, uma lista opcional de parâmetros (pares de nome e valor) e timeout pode ser especificada.
O item implementa parcialmente o padrão W3C WebDriver com Selenium Server ou um WebDriver puro (por exemplo, ChromeDriver) como endpoint de teste web. Para que o item funcione, defina o endpoint no parâmetro WebDriverURL do arquivo de configuração do Zabbix server/proxy (se estiver usando o ChromeDriver, veja Considerações de Segurança). Para melhor desempenho, considere usar um servidor dedicado para o ambiente de teste web.
As verificações de items de navegador são executadas e processadas pelos browser pollers do Zabbix server ou proxy. Se necessário, você pode ajustar o número de instâncias pré-inicializadas de browser pollers no parâmetro StartBrowserPollers do arquivo de configuração do Zabbix server/proxy.
Para monitorar sites e aplicações web complexas, o template Website by Browser está disponível como um template pronto para uso.
Configuração
No campo Tipo do formulário de configuração do item, selecione Navegador e preencha os campos obrigatórios.
Todos os campos obrigatórios estão marcados com um asterisco vermelho.
Os campos que exigem informações específicas para itens do tipo Navegador são:
| Campo | Descrição |
|---|---|
| Chave | Insira uma chave exclusiva que será usada para identificar o item. |
| Parâmetros | Especifique as variáveis a serem passadas para o script como pares de atributo e valor. Macros de usuário são suportadas. Para ver quais macros internas são suportadas, faça uma busca por "item do tipo Navegador" na tabela de macros suportadas. |
| Script | Insira o código JavaScript no editor modal que é aberto ao clicar no campo de parâmetro ou no ícone de lápis ao lado dele. Este código deve fornecer a lógica para retornar o valor da métrica. O código tem acesso a todos os parâmetros, a todos os objetos JavaScript adicionais e objetos JavaScript do item Navegador adicionados pelo Zabbix. Veja também: Guia JavaScript. |
| Timeout | Tempo limite de execução do JavaScript (1-600s; se excedido, retornará um erro). Observe que, dependendo do script, pode levar mais tempo para o timeout ser acionado. Para mais informações sobre o parâmetro Timeout, consulte atributos gerais do item. |
Exemplos
Para um exemplo de como configurar o Zabbix para monitorar sites usando o template Website by Browser, consulte Monitorar sites com itens Browser.
Script padrão
O seguinte script:
- Inicializa uma sessão do navegador.
- Navega até uma URL especificada.
- Coleta entradas de desempenho e estatísticas da sessão, e as retorna como uma string JSON.
No campo Script, insira:
var browser = new Browser(Browser.chromeOptions());
try {
browser.navigate("http://example.com");
browser.collectPerfEntries();
}
finally {
return JSON.stringify(browser.getResult());
}Inicializar o navegador com capacidades personalizadas
O seguinte script:
- Inicializa uma sessão do navegador para o navegador disponível com base no primeiro navegador correspondente na ordem especificada no script.
- Define as capacidades do navegador, incluindo a estratégia de carregamento da página e opções específicas para cada navegador, como o modo headless para os navegadores Chrome, Firefox e Microsoft Edge.
No campo Script, insira:
var browser = new Browser({
"capabilities":{
"firstMatch":[
{
"browserName":"chrome",
"pageLoadStrategy":"normal",
"goog:chromeOptions":{
"args":[
"--headless=new"
]
}
},
{
"browserName":"firefox",
"pageLoadStrategy":"normal",
"moz:firefoxOptions":{
"args":[
"--headless"
]
}
},
{
"browserName":"MicrosoftEdge",
"pageLoadStrategy":"normal",
"ms:edgeOptions":{
"args":[
"--headless=new"
]
}
},
{
"browserName":"safari",
"pageLoadStrategy":"normal"
}
]
}
});Inicializar navegador com GUI
Por padrão, as sessões do navegador (exceto Safari) são inicializadas no modo headless, o que significa que a interface gráfica do navegador (GUI) não é exibida.
O script a seguir inicializa uma sessão do navegador com a GUI ativada.
Observe que, se o WebDriver não conseguir localizar o binário do navegador, você pode especificar o caminho manualmente.
var opts = Browser.chromeOptions();
opts.capabilities.alwaysMatch['goog:chromeOptions'].args = [];
// Para inicializar uma sessão do Firefox com GUI, descomente as linhas a seguir:
// var opts = Browser.firefoxOptions();
// opts.capabilities.alwaysMatch['moz:firefoxOptions'].binary = 'usr/bin/firefox';
// opts.capabilities.alwaysMatch['moz:firefoxOptions'].args = [];
// Para inicializar uma sessão do Microsoft Edge com GUI, descomente as linhas a seguir:
// var opts = Browser.edgeOptions();
// opts.capabilities.alwaysMatch['ms:edgeOptions'].binary = 'usr/bin/microsoft-edge';
// opts.capabilities.alwaysMatch['ms:edgeOptions'].args = [];
var browser = new Browser(opts);Se seus testes estiverem sendo executados em um servidor remoto ou em um container, você pode usar um cliente Virtual Network Computing (VNC) para se conectar ao servidor VNC da máquina. Isso permite visualizar e interagir com a GUI do navegador remotamente.
Tirar capturas de tela
O seguinte script:
- Inicializa uma sessão do navegador.
- Define o tamanho da janela do navegador para determinar o tamanho da captura de tela (especificado como parâmetros, veja abaixo).
- Navega até uma URL (especificada como parâmetro, veja abaixo).
- Coleta estatísticas da sessão, captura uma captura de tela e a adiciona às estatísticas coletadas.
- Lida com erros capturando mensagens de erro e uma captura de tela.
- Retorna os resultados coletados como uma string JSON.
O script também utiliza parâmetros do formulário de configuração do item:
- webURL - http://example.com
- width - 1920
- height - 1080
No campo Script, insira:
var browser, result;
var browser = new Browser(Browser.chromeOptions());
try {
var params = JSON.parse(value); // Parse the JSON string containing parameters passed from Zabbix.
browser.setScreenSize(Number(params.width), Number(params.height))
browser.navigate(params.webURL);
result = browser.getResult();
result.screenshot = browser.getScreenshot();
}
catch (err) {
if (!(err instanceof BrowserError)) {
browser.setError(err.message);
}
result = browser.getResult();
result.error.screenshot = browser.getScreenshot();
}
finally {
return JSON.stringify(result);
}Verificar login no Zabbix
O seguinte script:
- Inicializa uma sessão do navegador.
- Navega até uma página (especificada como parâmetro, veja abaixo).
- Insere o nome de usuário e a senha (especificados como parâmetros, veja abaixo).
- Localiza e clica no botão de login.
- Localiza e clica no botão de logout.
- Coleta dados de desempenho antes e depois do login, bem como após o logout.
- Lida com erros capturando mensagens de erro e uma captura de tela.
- Retorna os resultados coletados como uma string JSON.
O script também utiliza parâmetros do formulário de configuração do item:
- webURL - http://{HOST.CONN}/index.php
- username - {$USERNAME}
- password - {$PASSWORD}
No campo Script, insira:
var browser, result;
browser = new Browser(Browser.chromeOptions());
try {
var params = JSON.parse(value); // Parse the JSON string containing parameters passed from Zabbix.
browser.navigate(params.webURL);
browser.collectPerfEntries("open page");
var el = browser.findElement("xpath", "//input[@id='name']");
if (el === null) {
throw Error("cannot find name input field");
}
el.sendKeys(params.username);
el = browser.findElement("xpath", "//input[@id='password']");
if (el === null) {
throw Error("cannot find password input field");
}
el.sendKeys(params.password);
el = browser.findElement("xpath", "//button[@id='enter']");
if (el === null) {
throw Error("cannot find login button");
}
el.click();
browser.collectPerfEntries("login");
el = browser.findElement("link text", "Sign out");
if (el === null) {
throw Error("cannot find logout button");
}
el.click();
browser.collectPerfEntries("logout");
result = browser.getResult();
}
catch (err) {
if (!(err instanceof BrowserError)) {
browser.setError(err.message);
}
result = browser.getResult();
result.error.screenshot = browser.getScreenshot();
}
finally {
return JSON.stringify(result);
}Encontrar links
O seguinte script:
- Inicializa uma sessão do navegador.
- Define uma função para remover elementos duplicados de um array (veja o passo 5).
- Navega até uma página (especificada como parâmetros, veja abaixo).
- Encontra links na página.
- Remove links duplicados para garantir que sejam únicos.
- Extrai apenas os links que começam com "http".
- Formata os links extraídos para uma estrutura específica.
- Lida com erros capturando mensagens de erro e uma captura de tela.
- Retorna os resultados coletados como uma string JSON.
O script também utiliza parâmetros do formulário de configuração do item:
- scheme - {$WEBSITE.SCHEME}
- domain - {$WEBSITE.DOMAIN}
- path - {$WEBSITE.PATH}
No campo Script, insira:
var browser, result;
browser = new Browser(Browser.chromeOptions());
try {
var params = JSON.parse(value); // Parse the JSON string containing parameters passed from Zabbix.
function uniq(a) {
return a.sort().filter(function (item, pos, ary) {
return !pos || item != ary[pos - 1];
});
}
browser.navigate(params.scheme + '://' + params.domain + params.path);
var el = browser.findElements("link text", "");
var links = [];
for (var n = 0; n < el.length; n++) {
links.push(el[n].getAttribute('href'));
}
links = uniq(links);
result = [];
for (i = 0; i < links.length; i++) {
if (links[i].match(/^http.*/)) {
var row = {};
row["{#URL}"] = links[i];
result.push(row);
}
}
}
catch (err) {
if (!(err instanceof BrowserError)) {
browser.setError(err.message);
}
result = browser.getResult();
result.error.screenshot = browser.getScreenshot();
}
finally {
return JSON.stringify(result);
}