WhaTap 모니터링 적용해보기 (2) - Next.js

 

안녕하세요! Tech뿌롱이 입니다. whatap 모니터링 주입 두번째 시간으로
오늘은 Next.js 기반 애플리케이션 서버에 적용하는 방법을 알아볼게요.

01. Whatap 에서 제공하는 파일을 특정 폴더에 복사합니다.

001. /app 폴더에 Whatap 에서 제공하는 파일 복사

/app $ ls
app.jar                  logs                     security.conf            
container.conf           paramkey.txt             whatap.agent-2.2.41.jar  whatap.conf

002. whatap.conf 파일 수정하기

license=[발급받은 license]
whatap.server.host=[설정된 host]
weaving=spring-boot-3.2
tx_caller_meter_enabled=true
sql_dbc_meter_enabled=true
httpc_host_meter_enabled=true
actx_meter_enabled=true
profile_sql_param_enabled=true
profile_basetime=0
profile_http_header_enabled=true
profile_http_parameter_enabled=true
logsink_enabled=true

02. Next 프로젝트의 root level에 파일 추가

 - 파일명 : server.ts

require("whatap");

const WhatapAgent = require("whatap").NodeAgent;
const { createServer } = require("http");
const { parse } = require("url");
const next = require("next");

const dev = process.env.NODE_ENV;
const hostname = "localhost";
const port = 3000;

const app = next({ dev, hostname, port });
const handle = app.getRequestHandler();

process.env.WHATAP_NAME = "와탭 모니터링에 보여질 서버명 예로 x2bee-fo-{ip2}-{ip3}";
process.env.WHATAP_SERVER_PORT = "6600";

app.prepare().then(() => {
  createServer(async (req, res) => {
    try {
      const parsedUrl = parse(req.url, true);
      const { pathname, query } = parsedUrl;

      /**
       * Render the page.
       */
      await handle(req, res, parsedUrl);
    } catch (err) {
      console.error("Error occurred handling", req.url, err);
      res.statusCode = 500;
      res.end("internal server error");
    }
  })
    .once("error", (err) => {
      console.error(err);
      process.exit(1);
    })
    .listen(port, () => {
      console.log(`> Ready on http://${hostname}:${port}`);
    });
});

03.pakckage.json 편집

001. package.json 에 dependency 추가

"dependencies": {
    "whatap": "^0.5.6",
}

002. script 에 server.ts 를 이용하게 변경

"script": {
    "start:prd": "cross-env APP_ENV=production node server.ts",
}

 

그럼 이제 시작해 볼까요!   npm run start:prd

  • 네이버 블로그 공유
  • 네이버 밴드 공유
  • 페이스북 공유