나같은 경우에는 axios 를 통해서 서버와 연결하려는 도중에

[AxiosError: Network Error]

위 에러만 떠서 원인도 모르고 url도 바꿔보고 포트도 바꿔보고 백 포트도 바꿔보고 별 난리를 다쳐봤다.

에러원인

_perfKey: "network_XMLHttpRequest_undefined/api/hello"

에러부분 코드

  useEffect(() => {
    axios
      .get(`${Config.API_URL}/api/hello`)
      .then(response => setHello(response.data))
      .catch(error => console.log(error));
  }, []);

내가 생각했을 때 get안에 들어가는 url .env 파일에서 오버라이드 한 API_URL=http://10.0.2.2:3105 값을 읽지 못하고 undefinded 나온다.

해결방법

변수값을 불러오지않고, url 그대로 복사붙여넣기하기

  useEffect(() => {
    axios
      .get('http://10.0.2.2:3105/api/hello`)
      .then(response => setHello(response.data))
      .catch(error => console.log(error));
  }, []);

일단 axios 네트워크 에러는 뜨지는 않지만, spring에서 받아오는 배열 값을 리턴하지 못하고 있다.
get에서는 저 변수값으 못읽나..? 생각이 들었다.
그렇게 생각한 이유가, 강의에서는 post('&{Config.API_URL}/user` , ...하면서 잘만 실행됐었다.
어떤게 문젠지는 진짜 모르겠다...

---

진짜문제해결

리액트 config에러
리액트에서 config가 내부값을 못 읽는 버그가 있다고한다..
지정한 값을 undefinded 뱉어내는데, 아래 코드를 알맞은 파일에다가 복붙해주어야한다.

Extra step for Android
You'll also need to manually apply a plugin to your app, from android/app/build.gradle:

// 2nd line, add a new apply:
apply from: project(':react-native-config').projectDir.getPath() + "/dotenv.gradle"

Advanced Android Setup
In android/app/build.gradle, if you use applicationIdSuffix or applicationId that is different from the package name indicated in AndroidManifest.xml in <manifest package="..."> tag, for example, to support different build variants: Add this in android/app/build.gradle

defaultConfig {
    ...
    resValue "string", "build_config_package", "YOUR_PACKAGE_NAME_IN_ANDROIDMANIFEST_XML"
}```

공식문서가 있어도 주워먹지 못하는 나~ 그래도 용기내서... 질문..했으니~... 나 칭찬해~..

이거 적용하니까 바로 백에서 return하는 hello,world 값을 주워온다.. 진짜 눈물 광광 이거때문에 내가 이상한짓을 얼마나 많이했는데.