본문 바로가기
GraphQL

Apollo GraphQL Error: "Cannot read property 'startsWith' of undefined"

by kicksky 2021. 3. 17.

기존 프로젝트의 서버를 Apollo graphQL로 재구축하는 작업을 하고 있는데 schema 작성하고, dataSource로 Open API에서 데이터 가져온 다음, 해당 쿼리에 대한 resolver 까지 작성해서 테스트를 하다가 에러가 발생했다.

 

"Cannot read property 'startsWith' of undefined"

 

에러 메세지는 위와 같았다.

 

우선, 대부분의 경우에 undefined는 비동기 요청을 했는데 데이터가 미처 들어오지 못하는 경우에 자주 봤던 것 같아서 RESTDataSource를 확장하여 인스턴스를 만들어준 클래스의 API URL을 확인했다. 결론부터 말하자면 다음과 같이 바꾸어 주었다.

 

전:

const AGE_ZERO_KINDERGARTEN_URL = 
	`https://openapi.gg.go.kr/Age0PrvuuseKidgartn?KEY=${process.env.API_KEY}&TYPE=json`;

class ageZeroKindergartenAPI extends RESTDataSource {
	...
    async getAllKindergartens() {
    	const response = await this.get();
    	...
    }
}

후:

const AGE_ZERO_KINDERGARTEN_URL = `https://openapi.gg.go.kr/`;

class ageZeroKindergartenAPI extends RESTDataSource {
	...
    async getAllKindergartens() {
    	const response = await this.get(
        	`Age0PrvuuseKidgartn?KEY=${process.env.API_KEY}&TYPE=json`
	)
}

URL을 담은 변수에는 도메인 주소만 작성하고, path와 parameter는 get 메소드의 인자로 넘겨주었다. 

 

RESTDataSources 타입 파일을 열어 startsWith를 검색하니 path에 대한 메소드인 것 같았다. 정확히는 모르겠지만 넘겨주는 URL을 재가공하는 과정에서 발생한 에러 같아서 API URL을 위와 같이 수정했다.

  ...
  protected resolveURL(request: RequestOptions): ValueOrPromise<URL> {
    let path = request.path;
    if (path.startsWith('/')) {
      path = path.slice(1);
    }
    const baseURL = this.baseURL;
    if (baseURL) {
      const normalizedBaseURL = baseURL.endsWith('/')
        ? baseURL
        : baseURL.concat('/');
      return new URL(path, normalizedBaseURL);
    } else {
      return new URL(path);
    }
  }

 

+)

콘솔을 찍어 데이터가 넘어오는 것까지는 확인했는데 response 객체의 필드 선택이 안 되길래 typeof로 타입을 확인해보니 string이였다. 이 Open API 데이터만 이런 건지는 모르겠는데 아무튼 이 데이터를 다시 JSON.parse(response) 해주어 JSON으로 파싱 했더니 원하는 데이터를 정상적으로 추출할 수 있었다.

 

댓글