DEV Community

Cover image for How to Log with Loki and Grafana Using NestJS 🚀
Juan Castillo
Juan Castillo

Posted on

1

How to Log with Loki and Grafana Using NestJS 🚀

Introduction

Have you ever wondered how to keep a detailed log of what's happening in your NestJS application? Logs are essential for monitoring and debugging applications, and with Loki and Grafana, we can take our logging to the next level. In this tutorial, you'll learn how to integrate Loki with NestJS to log and visualize messages efficiently. Let's get started! 📝✨

Prerequisites

Before we begin, make sure you have the following:

  • Basic knowledge of NestJS.
  • Node.js and npm installed on your machine.
  • A Grafana account and Loki set up.

Step 1: Setting Up the NestJS Project

First, let's create a new NestJS project. Open your terminal and run the following command:

npx @nestjs/cli new logging-project
cd logging-project
Enter fullscreen mode Exit fullscreen mode

Step 2: Installing Dependencies

We need to install axiosto send HTTP requests to Loki. Run the following command:

npm install axios
Enter fullscreen mode Exit fullscreen mode

Step 3: Creating the Logging Service

We'll create a logging service in NestJS that will send logs to Loki. Create a new file named logging.service.ts in the src/logging/ directory and add the following code:

import { Injectable, ConsoleLogger } from '@nestjs/common';
import axios from 'axios';

@Injectable()
export class LokiLogger extends ConsoleLogger {
  private static lokiUrl = process.env.LOKI_URL;
  private static lokiToken = process.env.LOKI_TOKEN;
  private static defaultLabels: any = {
    app: process.env.APP_NAME || 'not-set',
    env: process.env.NODE_ENV || 'development',
  };
  private static gzip = false;
  private static onLokiError: (error: any) => void = () => {};

  private static sendLokiRequest = (
    labels: Record<string, string>,
    message: string,
  ): any => {
    const data = JSON.stringify({
      streams: [
        {
          stream: labels,
          values: [[(Date.now() * 1000000).toString(), message]],
        },
      ],
    });

    axios({
      method: 'POST',
      url: `${LokiLogger.lokiUrl}/loki/api/v1/push`,
      headers: LokiLogger.gzip
        ? {
            'Content-Type': 'application/json',
            'Content-Encoding': 'application/gzip',
          }
        : {
            'Content-Type': 'application/json',
            Authorization: `Bearer ${LokiLogger.lokiToken}`,
          },
      data: data,
    })
      .then()
      .catch((error) => {
        if (LokiLogger.onLokiError) {
          LokiLogger.onLokiError(error);
        } else {
          console.error('error', error.message, error?.response?.data);
        }
      });
  };

  error(
    message: string,
    trace?: string,
    context?: string,
    labels?: Record<string, string>,
  ): void {
    LokiLogger.sendLokiRequest(
      {
        ...LokiLogger.defaultLabels,
        ...labels,
        context: context ?? this.context,
        level: 'error',
      },
      message,
    );
    super.error(message, trace, context);
  }

  log(
    message: string,
    context?: string,
    labels?: Record<string, string>,
  ): void {
    LokiLogger.sendLokiRequest(
      {
        ...LokiLogger.defaultLabels,
        ...labels,
        context: context ?? this.context,
        level: 'info',
      },
      message,
    );
    super.log(message, context);
  }

  warn(
    message: string,
    context?: string,
    labels?: Record<string, string>,
  ): void {
    LokiLogger.sendLokiRequest(
      {
        ...LokiLogger.defaultLabels,
        ...labels,
        context: this.context,
        level: 'warn',
      },
      message,
    );
    super.warn(message, context);
  }

  debug(
    message: string,
    context?: string,
    labels?: Record<string, string>,
  ): void {
    LokiLogger.sendLokiRequest(
      {
        ...LokiLogger.defaultLabels,
        ...labels,
        context: this.context,
        level: 'debug',
      },
      message,
    );
    super.debug(message, context);
  }

  verbose(
    message: string,
    context?: string,
    labels?: Record<string, string>,
  ): void {
    LokiLogger.sendLokiRequest(
      {
        ...LokiLogger.defaultLabels,
        ...labels,
        context: this.context,
        level: 'verbose',
      },
      message,
    );
    super.verbose(message, context);
  }
}

Enter fullscreen mode Exit fullscreen mode

Step 4: Using the Custom Logger in main.ts

Now, let's use this service as a custom logger in the main.ts file:

import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';
import { LokiLogger } from './logging/logging.service';

async function bootstrap() {
  const app = await NestFactory.create(AppModule, {
    logger: new LokiLogger(),
  });
  await app.listen(3000);
}
bootstrap();

Enter fullscreen mode Exit fullscreen mode

Step 5: Using the Logger in Your Controllers

Since we have set up LokiLoggeras a custom logger, we can use it directly in our controllers without needing to instantiate it manually. For example, in app.controller.ts:

import { Controller, Get, Logger } from '@nestjs/common';

@Controller()
export class AppController {
  private readonly logger = new Logger(AppController.name);

  @Get()
  getHello(): string {
    this.logger.log('This is an info message');
    this.logger.warn('This is a warning');
    this.logger.error('This is an error');
    return 'Hello World!';
  }
}
Enter fullscreen mode Exit fullscreen mode

Step 6: Viewing Logs in Grafana

With Loki receiving our logs, it's time to view them in Grafana:

  1. Log in to your Grafana instance.
  2. Create a new dashboard and add a panel.
  3. Configure a query to view the logs from your NestJS application, filtering by the labels defined.

Conclusion

And that's it! We have set up a simple but effective logging system using NestJS and Loki, with visualization in Grafana. Now, our applications can tell their story, and we can ensure everything is running smoothly. Happy logging! 🚀📊

References

NestJS Documentation
Loki Documentation

Heroku

Build apps, not infrastructure.

Dealing with servers, hardware, and infrastructure can take up your valuable time. Discover the benefits of Heroku, the PaaS of choice for developers since 2007.

Visit Site

Top comments (2)

Collapse
 
cassiorsfreitas profile image
Cássio Freitas

Good post, thanks for the content! By the way, does Loki accept connections (requests) from localhost? I'm getting a 401.

Collapse
 
juan_castillo profile image
Juan Castillo

Hi @cassiorsfreitas. Yes it does, allows requests from localhost, your problem is probably related to the Access Policies you have configured in Grafana Labs

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

👋 Kindness is contagious

Dive into an ocean of knowledge with this thought-provoking post, revered deeply within the supportive DEV Community. Developers of all levels are welcome to join and enhance our collective intelligence.

Saying a simple "thank you" can brighten someone's day. Share your gratitude in the comments below!

On DEV, sharing ideas eases our path and fortifies our community connections. Found this helpful? Sending a quick thanks to the author can be profoundly valued.

Okay