Question 223110 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – I have json logs for node error and I have to print one by one

I have a error message like this in json

{
    "message": "2023-08-04T13:52:01: Error: listen EADDRINUSE: address already in use :::55002023-08-04T13:52:01:     at Server.setupListenHandle [as _listen2] (node:net:1432:16)2023-08-04T13:52:01:     at listenInCluster (node:net:1480:12)2023-08-04T13:52:01:     at Server.listen (node:net:1568:7)2023-08-04T13:52:01:     at ExpressAdapter.listen (/var/www/html/01-haiku/haiku_back/node_modules/@nestjs/platform-express/adapters/express-adapter.js:68:32)2023-08-04T13:52:01:     at /var/www/html/01-haiku/haiku_back/node_modules/@nestjs/core/nest-application.js:166:302023-08-04T13:52:01:     at new Promise (<anonymous>)2023-08-04T13:52:01:     at NestApplication.listen (/var/www/html/01-haiku/haiku_back/node_modules/@nestjs/core/nest-application.js:155:16)2023-08-04T13:52:01:     at bootstrap (/var/www/html/01-haiku/haiku_back/src/main.ts:36:9) {2023-08-04T13:52:01:   code: 'EADDRINUSE',2023-08-04T13:52:01:   errno: -98,2023-08-04T13:52:01:   syscall: 'listen',2023-08-04T13:52:01:   address: '::',2023-08-04T13:52:01:   port: 55002023-08-04T13:52:01: }",
    "timestamp": "2023-08-04T08:22:01.151Z",
    "type": "err",
    "process_id": 0,
    "app_name": "local-haiku-api"
}

But I want to display(print) below like that in a html page

"2023-08-04T13:52:01: Error: listen EADDRINUSE: address already in use :::55002023-08-04T13:52:01:    
   at Server.setupListenHandle [as _listen2] (node:net:1432:16 undefined)2023-08-04T13:52:01:    
   at listenInCluster .listenInCluster (node:net:1480:12 undefined)2023-08-04T13:52:01:    
   at Server.listen (node:net:1568:7 undefined)2023-08-04T13:52:01:    
   at ExpressAdapter.listen (/var/www/html/01-haiku/haiku_back/node_modules/@nestjs/platform-express/adapters/express-adapter.js:68:32 undefined)2023-08-04T13:52:01:     at /var/www/html/01-haiku/haiku_back/node_modules/@nestjs/core/nest-application.js:166:302023-08-04T13:52:01:    
   at new Promise .new Promise (<anonymous> undefined)2023-08-04T13:52:01:    
   at NestApplication.listen (/var/www/html/01-haiku/haiku_back/node_modules/@nestjs/core/nest-application.js:155:16 undefined)2023-08-04T13:52:01:    
   at bootstrap .bootstrap (/var/www/html/01-haiku/haiku_back/src/main.ts:36:9 undefined) {2023-08-04T13:52:01:   code: 'EADDRINUSE',2023-08-04T13:52:01:   errno: -98,2023-08-04T13:52:01:   syscall: 'listen',2023-08-04T13:52:01:   address: '::',2023-08-04T13:52:01:   port: 55002023-08-04T13:52:01: }"

How to achieve this?

Tags:

2

Answers


  1. 0

    It looks like you want to format and display the error message you provided in a more readable way on an HTML page. To achieve this, you can follow these steps:

    1. Extract the Error Message: First, you need to extract the error message from the JSON response. You can do this by accessing the "message" field in the JSON.

    2. Replace Newlines: The error message contains newline characters (n) which you want to replace with <br> tags to display them as line breaks in HTML.

    3. Format the Message: It seems you also want to format the error message to display the stack trace in a clearer way. You can replace the format 2023-08-04T13:52:01: with an empty string to remove the timestamp prefixes.

    Here’s a code snippet in JavaScript that demonstrates how you can achieve this:

    // Sample JSON error message
const errorMessage = {
  "message": "2023-08-04T13:52:01: Error: listen EADDRINUSE: address already in use :::5500...",
  // Rest of the JSON
};

// Extract the error message from the JSON
const originalErrorMessage = errorMessage.message;

// Replace newline characters with <br> tags
const formattedMessage = originalErrorMessage.replace(/n/g, '<br>');

// Remove timestamp prefixes
const cleanStackTrace = formattedMessage.replace(/d{4}-d{2}-d{2}Td{2}:d{2}:d{2}:/g, '');

// Display the formatted message in HTML
const errorContainer = document.getElementById('error-container'); // Replace with your HTML element ID
errorContainer.innerHTML = cleanStackTrace;

    In your HTML, you would need an element with an ID that matches the one you used in the JavaScript code. For example:

    <div id="error-container"></div>

    This JavaScript code will modify the error message to replace newlines with <br> tags and remove the timestamp prefixes. Then, it will insert the formatted error message into the specified HTML element.

    Remember to include this JavaScript code within a <script> tag on your HTML page, preferably after the HTML element where you want to display the error message.

    Please adapt this code to your project structure and integrate it where needed.

    Login or Signup to reply.
  2. 0 
    <!DOCTYPE html>
<html>
<head>
  <title>Error Message</title>
</head>
<body>
  <pre id="error-message"></pre>

  <script>
    const errorMessage = {
      "message": "2023-08-04T13:52:01: Error: listen EADDRINUSE: address already in use :::55002023-08-04T13:52:01:     at Server.setupListenHandle [as _listen2] (node:net:1432:16)2023-08-04T13:52:01:     at listenInCluster (node:net:1480:12)2023-08-04T13:52:01:     at Server.listen (node:net:1568:7)2023-08-04T13:52:01:     at ExpressAdapter.listen (/var/www/html/01-haiku/haiku_back/node_modules/@nestjs/platform-express/adapters/express-adapter.js:68:32)2023-08-04T13:52:01:     at /var/www/html/01-haiku/haiku_back/node_modules/@nestjs/core/nest-application.js:166:302023-08-04T13:52:01:     at new Promise (<anonymous>)2023-08-04T13:52:01:     at NestApplication.listen (/var/www/html/01-haiku/haiku_back/node_modules/@nestjs/core/nest-application.js:155:16)2023-08-04T13:52:01:     at bootstrap (/var/www/html/01-haiku/haiku_back/src/main.ts:36:9) {2023-08-04T13:52:01:   code: 'EADDRINUSE',2023-08-04T13:52:01:   errno: -98,2023-08-04T13:52:01:   syscall: 'listen',2023-08-04T13:52:01:   address: '::',2023-08-04T13:52:01:   port: 55002023-08-04T13:52:01: }",
      "timestamp": "2023-08-04T08:22:01.151Z",
      "type": "err",
      "process_id": 0,
      "app_name": "local-haiku-api"
    };

    const errorMessageText = errorMessage.message
      .replace(/(d{4}-d{2}-d{2}Td{2}:d{2}:d{2}:)/g, 'n$1')
      .replace(/(d{4}-d{2}-d{2}Td{2}:d{2}:d{2})/g, '$1: ')
      .replace(/t/g, '    ');

    const errorMessageElement = document.getElementById('error-message');
    errorMessageElement.textContent = errorMessageText;
  </script>
</body>
</html>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search