hg-pyun/axios-logger

Beautify Axios Logging Messages

axios-logger's Issues

Make deploy script

Prevent people from making mistakes during distribution(#38, #39).

Improve develop environment

Change to test based dev env.

Support filtering data

Feature

• Support Filtering data/head

const config = {
  dataFilter: regex
  headFilter: ['custom-header'] 
}

output

prefix url response-code filtered-head filtered-data

Add contributing guide

Using local TSC

Currently, this source developed by global tsc. This can cause version issues.

convert typescript job scheduling

TBD

Introduce page

Support simple introduce page using github.io

Add issue templates

Add issue templates

add typescript typings

I'd like to be able to use this in our typescript app, but in order to do that I need typescript types. You don't have to rewrite to typescript just include the typescript definition file in the release

Planing 2.3.0

Features

• Make deploy script #41
• Add test cases #37

Error logger crashes if config is null or undefined

Hi! Sometimes the axios error comes with config null or undefined, and the errorLogger crashes with this exception

ERROR: Cannot destructure property `method` of 'undefined' or 'null'.

As a workaround I resolved it by adding this validation in the axios interceptor

axiosInstance.interceptors.response.use(responseLogger, (error) => {
  if (error.config && error.response) {
    return errorLogger(error)
  }
  return Promise.reject(error)
})

But I think the best solution is to add a validation in the errorLogger to prevent this type of crashes (if I catch some free time I can solve this and create the PR).

Thanks!

Note: I think is related with this issue #50

Refactoring via Typescript

Refactoring via typescript

Add body trimming

When logging the bodies of large requests or responses it would make sense to allow them to be limited to a certain size. Otherwise large bodies clutter the console without adding value.

"headers" config is called "header" in readme and on npm

If you do header: true then you do not get headers, because if you look in the code it is looking for headers plural.

Providing the headers option instead of header fixes this.

Documentation needs updating to use plural.

Publishing 2.4.0 Features

Summary

I'm sorry I'm late. When all the functions below are developed, we will publish 2.4.0.
It will be distributed sometime in August. Thank you for waiting.
Thank you for feedback @ClintEsteMadera, @Fylipp, @mirfilip, @xenoterracide, and others.

Features

• Add body trimming (#55)
• Support more loggers (#53) (#62)
• Placing HTTP method first, then the URL (#60) (#63)
• Allow for no timestamp being appended (#64)
• Explicitly set defaults in the code, as documented (#65)

makeHeader missing from NPM release

I have axios-logger installed via NPM, v2.2.0.
Based on github, that release should have makeHeader included: https://github.com/hg-pyun/axios-logger/releases
Which is also backed up by the commit/tag that corresponds with the release: a6c3fd4

Yet looking at the code that NPM fetched, makeHeader doesn't exist in the module's lib/ directory.

If I download the 2.2.0 zip asset, I see the same issue, the lib/ directory is outdated. The src/ directory has the latest code, so the assets weren't properly built.

Tagging @hg-pyun

Save log data

Feature

• Save log data, local file
• Support log-rotate

const config = {
  saveLocal: true,
  logRotate: true,
  filePath: './var/log'
}

Add change log

Add change log

2.0.0 Feature Listing

improve logging features. please comment feature if you have idea.

Planing 2.3.1

• #49
• #50
• #43
• #28

Customizing logger function doesn't work, always uses global config logger

printLog only knows about global configs:

function printLog (text: string) {
    getGlobalConfig().logger(text);
}

need to have it merge with provided config overrides

Log Format

What is the required parameters?

Change logger

I'd like to be able to log using winston in our app, but I want the output string that you generate. to pass to it.

errorLoggerWithoutPromise cannot destructure url when using baseUrl in instance config

Describe the bug
It seems the destructuring does not work when using baseURL in config

To Reproduce

const API_URL = 'http://localhost:5000'
const api = axios.create({
  baseURL: API_URL,
  method: 'post'
})

if (process.env.NODE_ENV !== 'production') {
  api.interceptors.request.use(
    AxiosLogger.requestLogger,
    AxiosLogger.errorLogger
  )
  api.interceptors.response.use(
    AxiosLogger.responseLogger,
    AxiosLogger.errorLogger
  )
}
// Request
async function  get(args){
  const { data } = await api.post(`/validate/${args.code}`, {})
  return data
}
get()
// Cannot destructure property `url` of 'undefined' or 'null'.

Expected behavior
error could be logged

Include headers in logs

Is your feature request related to a problem? Please describe.
We would like to log request headers (among the HTTP method) for making tests more readable.

Describe the solution you'd like
The typings for this behaviour (RequestLogConfig) seems to be in place already. We would like the configuration to be respected when printing logs.

Additional context
We think this is the relevant area, where the headers flag should be used.
https://github.com/hg-pyun/axios-logger/blob/master/src/logger/request.ts#L12-L21

Thank you!

Logo Image

Release 2.5.0

List

• Enriched README with more information on how to specify the logger function to be used. (#66)
• Add log config into error logger with a promise (#72) (#73)
• Customizing logger function doesn't work, always uses global config logger (#75) (#76)
• Remove lib folder (#77) (#78)
• Add body trimming (#55)
• Show query params for GET requests (#67)
• logger is a required but not actually used (#71)
• Set test env

logger is a required but not actually used

logger field is required if config is supplied, but request/responseLogger functions don't actually use it.

I have, e.g. this

        return responseLogger(request, {
          prefixText: 'Contentful',
          logger: (): void => {},
        });

but that logger method is required in the types, but it's not actually used. I'd like for the field to be optional, in case the default is fine. also have printjs use the individual request/response logger settings by default, because in our case we have Contentful which wraps axios, and we have our own axios calls, so having different logger settings would be ideal.

Ignore lib folder

There is no need to push transpiled code into the repository. It should be added into .gitignore. Also a prepare script should be added into package.json to make sure that lib is regenerated before publishing the package into npm.

Error Log Prototyping

Error Log Prototyping

2.0.0 Dev

• Refactoring via Typescript
• Logging with storage
• Support filtering #8
• Support custom format

Write down test case

Write down test case. using test tool such as mocha, jest, and etc.

Add response data to errors

Thank you for this library! Could you please add response data to errors? Would help with debugging :)

Refactoring

Usage of console.log

This lib looks like a decently thought out thing, apart from hardcoded usage of console.log. Is there a reason other general loggers are not allowed?

Majority of people use a real logger like Pino, Bunyan etc.

Buffer in logs

It is always frustrating when request/response contains a buffer. Dumping in console as is totally useless because of huge amount of data inside and causes a harder debug of other requests.

#55 will help in a certain way. Though it will be nice to have an option to completely exclude buffer data from logging.

Now

[Axios][Response] GET http://example.com/some_file_.pdf {"type":"Buffer","data [255,216,255,224,0,16,74,70,73,70,0,1,1,0,
0,72,0,72,0,0,255,219,0,67,0,1,1,1,1,1,1,2,1,1,2,3,2,2,2,3,4,3,3,3,3,4,6,4,4,4,4,4,6,7,6,6,6,6,6,6,7,7,7,7,7,7,7,7,8,8,8,8,8,8,9,9,9,9,9,
11,11,11,11,11,11,11,11,11,11,255,219,0,67,1,2,2,2,3,3,3,5,3,3,5,11,8,6,8,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,
11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,11,255,194,0,17,8,3,32,4,176,3,1,34,0,2,17,1,3,17,1,255,196,0,
29,0,1,0,1,4,3,1,0,0,0,0,0,0,0,0,0,0,0,2,1,6,7,8,3,5,9,4,255,196,0,27,1,1,0,2,3,1,1,0,0,0,0,0,0,0,0,0,0,0,4,6,2,3,5,7,1,255,218,0,12,3,1,
0,2,16,3,16,0,0,1,188,120,143,90,240,144,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2,225,157,182,215,178,225,91,207,171,
151,231,232,128,103,172,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,28,188,64,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
...and so on....
...many lines...

Want to

[Axios][Response] GET http://example.com/some_file_.pdf [Buffer]

Update readme.md

Update readme.md

Save logs on debug mode

Save logs on debug mode

• file system
• local storage

Axios baseURL is ignored

Description

When using Axios' baseURL property (as seen in this example), baseURL is ignored, and only the url suffix is shown in logs.

Proposal

When the url config is set to true, both baseURL and url should be concatenated, maybe demarcating the base with a different color, or providing an extra flag for not showing the base.

Example code

import axios from 'axios';
import * as AxiosLogger from 'axios-logger';

const instance = axios.create({
  baseURL: 'https://github.com',
});

instance.interceptors.request.use(AxiosLogger.requestLogger, AxiosLogger.errorLogger);
instance.get('/hg-pyun');

• expected output: [Axios][Request] GET https://github.com/hg-pyun
• actual output: [Axios][Request] GET /hg-pyun

Show query params for GET requests

add query params display for GET requests, and option for controlling.

await axios.get(`/wp-json/wp/v2/posts`, {
  params: {
    slug: "article",
   _fields: "id"
  }
}

to:

Develop Plan

TBD

Basic Usage Document

Basic usage document

Log Configuration

Feature

• Setting Configuration global/local
• There are same properties

interface config {
    prefixText?: string | boolean,
    dateFormat?: string | boolean,
    data?: boolean,
    url?: boolean,
    method?: boolean,
    headers?: boolean,
    status?: boolean,
    statusText?: boolean,
    code?: boolean,
}

errorLogger to accept ErrorLogConfig

Both requestLogger and responseLogger accept CommonConfig properties. However, errorLogger for some reason doesn't. I would like to set local configuration for errorLogger.

When publish to NPM, exclusive source file

Feature

• When publish to NPM, exclusive source file

.npmignore

/src/

Add json / logfmt format options

Is your feature request related to a problem? Please describe.
This is a handy lib, ideally it would plug into a standard display format as used by grafana (formats in here - https://grafana.com/docs/loki/latest/logql/#Metric-Queries)

Describe the solution you'd like
Return Json or logfmt

Describe alternatives you've considered
Writing long hand regex, but that seems pretty brittle.

formatting is not as advertized

documentation suggests I should get

POST http://.../api/3.0/drink/pickup {...}

instead I get

    [Axios][Request] 2020-06-30T14:57:51-0500 3.0/drink/pickup POST {"order_id":851869,"code":"123"}

the lack of the baseurl is problematic for me as I was just sending to the wrong url

  axios.interceptors.request.use((req) => {
    return requestLogger(req, {
      method: true,
      url: true,
    });
  }, errorLogger);
  axios.interceptors.response.use(responseLogger, errorLogger);```

improve error formatting

improve error formatting

Update lodash module

Merge #31

Support Webpack 5

Webpack 5 has no longer NodeJs polyfills
https://webpack.js.org/migrate/5/#test-webpack-5-compatibility

There is no error building with Webpack 4 but it crashes with Webpack 5 because of chalk dependency

vendors.js:53270 Uncaught ReferenceError: process is not defined
    at Object.../../node_modules/axios-logger/node_modules/chalk/index.js (vendors.js:53270)
    at __webpack_require__ (runtime.js:22)
    at Object.../../node_modules/axios-logger/lib/common/string-builder.js (vendors.js:52803)
    at __webpack_require__ (runtime.js:22)
    at Object.../../node_modules/axios-logger/lib/logger/request.js (vendors.js:53007)
    at __webpack_require__ (runtime.js:22)
    at Object.../../node_modules/axios-logger/lib/index.js (vendors.js:52926)
    at __webpack_require__ (runtime.js:22)
    at Module.../shared/src/api/axios.ts (main.js:22861)
    at __webpack_require__ (runtime.js:22)

I guess latest version of chalk doesnt use process.platform anymore.
Maybe it is time to update it? :)