Captura de erros no front-end - AppSignal Documentation

Para relatar um erro ao AppSignal, capture o erro e passe-o para a função auxiliar sendError. Se você estiver usando TypeScript, para usar a função auxiliar sendError, o argumento deve ser uma instância de Error ou ErrorEvent. Isso porque, no TypeScript, variáveis capturadas são do tipo unknown por padrão no modo estrito desde a versão 4.4.

try {
  // do something that might throw an error
} catch (error) {
  if (error instanceof Error || error instanceof ErrorEvent) {
    appsignal.sendError(error)
    // handle the error
  }
}

// You can catch errors asynchronously by listening to Promises...
asyncActionThatReturnsAPromise().catch(error => appsignal.sendError(error))

// ...or by using async/await
async function() {
  try {
    const result = await asyncActionThatReturnsAPromise()
  } catch (error) {
    if (error instanceof Error || error instanceof ErrorEvent) {
      appsignal.sendError(error)
      // handle the error
    }

  }
}

// ...or in an event handler or callback function
events.on("event", (err) => { appsignal.sendError(err) })

Adicionando metadados aos erros

Para adicionar metadados adicionais aos erros enviados com sendError, use o argumento da função de callback. Esse callback recebe o Span atual do erro como argumento e permite que ele seja modificado antes de ser enviado para os servidores do AppSignal. Veja a página da API Span para mais informações sobre todos os dados que podem ser definidos em um Span.

try {
  // do something that might throw an error
} catch (error) {
  appsignal.sendError(error, (span) => {
    span.setAction("MyCustomAction");
    span.setNamespace("custom_namespace");
    span.setTags({ tag1: "value 1", tag2: "value 2" });
  });
  // handle the error
}

Exceções não capturadas

Exceções não capturadas não são capturadas por padrão. Tomamos a decisão de não incluir essa funcionalidade como parte da biblioteca principal devido à grande quantidade de ruído de extensões de navegador, bloqueadores de anúncios, etc., que geralmente torna bibliotecas como esta menos eficazes. Recomendamos usar uma integração relevante como uma maneira melhor de lidar com exceções, ou, se você preferir capturar exceções não capturadas, pode fazer isso usando o pacote @appsignal/plugin-window-events junto com este.

Envolvendo um bloco de código

A biblioteca fornece um método de conveniência para envolver um bloco de código e enviar qualquer erro lançado dentro dele diretamente para o AppSignal. Esse é o método appsignal.wrap(), uma função assíncrona que retorna uma Promise. Uma função deve ser passada como argumento contendo o código que você gostaria de envolver.

try {
  await appsignal.wrap(() => {
    // catch any error from sync or async code here
  });
} catch (e) {
  // do something else with the error here, the
  // error has already been sent to AppSignal
}

// Alternative usage
appsignal
  .wrap(() => {
    // catch any error from sync or async code here
  })
  .catch((e) => {
    // do something else with the error here, the
    // error has already been sent to AppSignal
  });

Se um erro for lançado em qualquer lugar dessa função, retornamos uma promise rejeitada com o Error passado como argumento para o handler catch.

Adicionando metadados a erros envolvidos

Para adicionar metadados adicionais a erros capturados e enviados com wrap, use o argumento da função de callback. Esse callback recebe o Span atual do erro como argumento e permite que ele seja modificado antes de ser enviado para os servidores do AppSignal. Veja a página da API Span para mais informações sobre todos os dados que podem ser definidos em um Span.

appsignal.wrap(
  () => {
    throw new Error("Test error");
  },
  (span) => {
    span.setAction("MyCustomAction");
    span.setNamespace("custom_namespace");
    span.setTags({ tag1: "value 1", tag2: "value 2" });
  },
);

Erros do GraphQL

Se você estiver usando o cliente GraphQL urql, consulte a documentação do @appsignal/urql para instruções sobre como configurar o relatório de erros do GraphQL.

​Adicionando metadados aos erros

​Exceções não capturadas

​Envolvendo um bloco de código

​Adicionando metadados a erros envolvidos

​Erros do GraphQL

Adicionando metadados aos erros

Exceções não capturadas

Envolvendo um bloco de código

Adicionando metadados a erros envolvidos

Erros do GraphQL