React×Redux로 웹 앱을 만들고 거기에 Sentry를 넣습니다.
뭔가 오류가 발생했을 때 Redux State와 함께 로그가 전송되어 매우 편리합니다.

그러나, 최근에 에러의 송신시에 413 (Request Entity Too Large) 라고 되돌아오게 되었습니다.


아마도 API에서 얻은 테이블의 데이터를 모두 Redux State에 넣어서 크기가 너무 커졌을 것입니다.
뭔가 문제가 발생했는지조차 탐지할 수 없는 것은 불편합니다.
게다가, 에러의 해석을 하기 위해서 테이블의 내용은 거의 필요하지 않을 것.

Sentry에 데이터를 보낼 때 State에서 오류를 분석하는 데 필요하지 않은 데이터를 삭제하여 크기를 줄여 413에서 화를 내지 않도록하십시오.

방법

어쩌면 Sentry를 넣고있는 부분은 이런 느낌이 있을 것입니다.

import { createStore, applyMiddleware, combineReducers } from 'redux';
import reducer from '../reducers/index';
import Raven from 'raven-js';
import createRavenMiddleware from 'raven-for-redux';
import thunk from 'redux-thunk';

export default function configureStore() {
  Raven.config(SENTRY_KEY).install();
  const middlewares = [thunk, createRavenMiddleware(Raven, {})];

  return createStore(
    combineReducers(assign({}, reducers)),
    applyMiddleware(...middlewares)
  );
}

변경하는 createRavenMiddleware 부분

  const middlewares = [thunk, createRavenMiddleware(Raven, {})];

여기의 제 2 인수에는 여러가지 옵션을 붙일 수 있습니다.
그리고, 옵션의 하나에 stateTransformer 라고 하는 State의 변환을 실시하기 위한 옵션이 있군요
htps : // 기주 b. 이 m/카 pt바리토네/라ゔぇーーぉr-레즈 x/bぉb/마s r/레아 D메. md # s 갓 t ran s fu rme r fu c 치온

이 옵션을 넣으면 이런 느낌

  const middlewares = [thunk, createRavenMiddleware(Raven, {
    stateTransformer: (state) => {
      // いらないデータを消す
      const returnState = state;
      delete returnState.table;
      delete returnState.bigData;
      delete returnState.largeData;
      return returnState;
    },
  })];

이제 필요하지 않은 데이터를 오류 로그에 포함시키지 않으므로 413 (Request Entity Too Large)를 해결할 수 있습니다.

주의해야 할 점

첫 번째 인수에 들어온다. 수 없습니다.

반대로 state를 직접 재작성해 버려도 문제는 일어나지 않는다고 하는 것이므로, 그것은 그것으로 안심일지도.

같은 에러로 곤란한 사람의 도움이 되면 다행입니다.