React Native JSON.stringify cannot serialize circular structures

We create an RN application (RN0.37) and run into a problem when we get " TypeError: JSON.stringify cannot serialize cyclic structures" when starting the application .

Nothing significant has changed in the API responses, and the problems have recently disappeared, but have reappeared after erasing / rebuilding (caused by unrelated problems).

My suspicions are related to a couple of packages used: " react-native-router-flux" and " react-native-permissions", but I could not find anything relevant in the application.

My current suspicions about "response-native-router-flux" are mainly based on this article: https://github.com/aksonov/react-native-router-flux/issues/363

And my suspicions about the "native response permissions" are mainly based on the fact that the timing for including this package in this project is suspicious and seems to coincide with the appearance of this error - although I can’t prove that with absolute certainty.

The only additional clue I have is that the JSON.stringify error is always preceded by a list of warnings. They all read: “This synthetic event is reused for performance reasons. If you see this, you are accessing the property for the released / canceled synthetic event. This value is zero. If you want to keep the original synthetic event, use it event.persist(). See https: / /facebook.imtqy.com/react/docs/events.html#event-pooling for more information. "The list looks like this (always in the same order): nativeEvent, type, target, currentTarget, eventPhase, bubbles, cancelable, timeStamp, defaultPrevented, isTrusted and touchHistory.

Here is my package.json:

"dependencies": {
  "blueimp-md5": "2.5.0",
  "moment": "2.16.0",
  "phone-formatter": "0.0.2",
  "react": "15.3.2",
  "react-native": "0.37.0",
  "react-native-asset-library-to-base64": "1.0.1",
  "react-native-aws3": "0.0.3",
  "react-native-button": "1.7.1",
  "react-native-cached-image": "1.2.2",
  "react-native-camera-kit": "4.0.1",
  "react-native-camera-roll-picker": "1.1.9",
  "react-native-contacts": "0.5.2",
  "react-native-fbsdk": "0.4.0",
  "react-native-fetch-blob": "0.10.0",
  "react-native-fs": "2.0.1-rc.2",
  "react-native-geocoder": "0.4.5",
  "react-native-image-crop-picker": "0.10.5",
  "react-native-image-resizer": "0.0.12",
  "react-native-nav": "1.1.4",
  "react-native-permissions": "0.2.5",
  "react-native-photo-view": "1.2.0",
  "react-native-router-flux": "3.37.0",
  "react-native-stripe": "1.2.1",
  "react-native-swipe-list-view": "0.3.1",
  "react-redux": "4.4.6",
  "redux": "3.6.0",
  "redux-storage": "4.1.1",
  "redux-storage-engine-reactnativeasyncstorage": "1.0.2",
  "underscore": "1.8.3"
}
+8
2

JSON.stringify JSON, .

, JSON.stringify(), , . - . .

2

+3

getCircularReplacer JSON.stringify() :

const getCircularReplacer = () => {
    const seen = new WeakSet();
    return (key, value) => {
    if (typeof value === "object" && value !== null) {
        if (seen.has(value)) {
            return;
        }
        seen.add(value);
    }
    return value;
    };
};

:

JSON.stringify(circularReference, getCircularReplacer());
// {"otherData":123}
0

Source: https://habr.com/ru/post/1669902/


All Articles