Introducción al servicio de uso y las API

Este artículo muestra cómo configurar un servidor simple para recopilar eventos del servicio de uso (un servidor de eco) y mostrarlos en la consola. También aprenderás a crear un proyecto de API de ejemplo que enviará eventos al servidor de eco. También verás cómo modificar el evento enviado al servicio de uso mediante variables de entorno.

Prerrequisitos

Necesita instalar Node.js para utilizar este ejemplo. Consulte Node.js para obtener el instalador de Node.js.

Configuración de un servidor Echo

Cree un archivo que contenga el código que se muestra a continuación:

const express = require('express')
const bodyParser = require('body-parser')

const app = express()

// Parse JSON bodies.
app.use(bodyParser.json())
// Accept events.
app.post('/:version/event', (req, res) => {
  const event = req.body
  console.log(event)

  // Respond so the client is happy.
  res.status(200)
  res.send('Event accepted!')
})

// Listen for requests.
app.listen(3000)

Llamaremos al archivo echo-server.js. Guárdalo en un nuevo directorio y cambia a ese directorio.

El servidor escucha las solicitudes en el puerto 3000 y escribe el cuerpo de la solicitud recibida en la consola. Así que, cada vez que se ejecuta un cliente API o una prueba CLI (y el registro de uso está habilitado), el servidor de eco escribe el evento de uso recibido.

Instala express y body-parser, dos dependencias necesarias para ejecutar el código anterior:

npm i express body-parser

Inicia el servidor de eco:

node echo-server.js

Creando una prueba

Puede utilizar el Catálogo de ejemplos para obtener un código de prueba. Cuando ejecute el código de prueba, enviará datos de métricas de uso al servidor de eco que creó en la sección anterior.

Inicie una nueva ventana de terminal o consola para los siguientes pasos.

Clone el repositorio Deque Examples Catalog en GitHub y luego cámbiese a ese directorio:

git clone git@github.com:dequelabs/axe-devtools-html-api-examples.git
cd axe-devtools-html-api-examples

Para este ejemplo, utilizamos el código de ejemplo Playwright de Node.js. Cambie a ese directorio e instale los paquetes Node.js necesarios:

cd Node/playwright
npm i

Es posible que también necesites instalar las dependencias de Playwright:

npx playwright install

Ahora configure las variables de entorno necesarias para habilitar los informes de métricas y configure el servidor en el servidor de eco local que creó anteriormente:

• export AXE_TRACK_USAGE=true
• export AXE_METRICS_URL=http//localhost:3000

Puede configurar las variables de entorno y ejecutar las pruebas (npm test) desde la línea de comandos en Linux y macOS:

AXE_TRACK_USAGE=true AXE_METRICS_URL=http://localhost:3000 npm test

set AXE_TRACK_USAGE=true
set AXE_METRICS_URL=http://localhost:3000

setx AXE_TRACK_USAGE true
setx AXE_METRICS_URL http://localhost:3000

La ventana de terminal que contiene el servidor de eco en ejecución mostrará resultados como los siguientes:

{
  dateTime: '2023-01-20T17:26:54.371Z',
  productComponent: 'api-node-playwright',
  productName: 'axe-devtools-html',
  version: 'v2',
  event: 'analyze',
  distinctId: '1b8a5e67-eb1f-4637-9668-be3a332d2c41',
  applicationProperties: {
    target: 'https://broken-workshop.dequelabs.com/',
    target_medium: 'text/html',
    engineVersion: '4.5.2',
    failedRuleCount: 2,
    failedRuleNames: 'color-contrast,label',
    failedItemCount: 5,
    inapplicableRuleCount: 39,
    incompleteRuleCount: 2,
    passedRuleCount: 21,
    testResults: {}
  }
}

Para obtener detalles sobre las propiedades de este objeto, consulte El Objeto de Evento.

Cambiar el evento mediante variables de entorno

Puede cambiar el evento que las APIs o CLI envían al servicio de uso mediante variables de entorno. Este ejemplo demuestra cómo cambiar el evento.

Primero, configure una variable de entorno para el valor que desea cambiar, por ejemplo:

export AXE_DEPARTMENT="test department"

Esto cambiará la propiedad departamento en el objeto de evento, como se muestra en el siguiente ejemplo (en Linux o macOS):

AXE_DEPARTMENT="test department" AXE_TRACK_USAGE=true AXE_METRICS_URL=http://localhost:3000  npm test

Desde la ventana de terminal donde estás ejecutando el servidor de eco, deberías ver un evento que incluye información del departamento como lo muestra la línea resaltada a continuación:

{
  dateTime: '2023-01-20T17:31:48.422Z',
  productComponent: 'api-node-playwright',
  productName: 'axe-devtools-html',
  version: 'v2',
  event: 'analyze',
  distinctId: '18cd1262-b5b7-4681-9f7a-a7d4c97745c8',
  applicationProperties: {
    target: 'https://broken-workshop.dequelabs.com/',
    target_medium: 'text/html',
    engineVersion: '4.5.2',
    failedRuleCount: 2,
    failedRuleNames: 'color-contrast,label',
    failedItemCount: 5,
    inapplicableRuleCount: 39,
    incompleteRuleCount: 2,
    passedRuleCount: 21,
    testResults: {}
  },
  department: 'test department'}

Para obtener más información sobre las variables de entorno que puede utilizar para modificar eventos de uso, consulte Control del servicio de uso a través de variables de entorno.

Próximos pasos

Para seguir una versión de este tutorial para la CLI, consulte Introducción al servicio de uso y la CLI.

Para obtener información general sobre el servicio de uso, consulte El servicio de uso.

Para obtener una referencia del objeto de evento, consulte Referencia de eventos del servicio de uso.