🚀 프로젝트/리그 오브 레전드 정보 앱

리그 오브 레전드 정보 앱 | 트러블슈팅 (4): 챔피언 정보 조회 시 Access Denied 오류 해결

seheej 2024. 10. 11. 16:45

리그 오브 레전드 데이터를 사용하는 프로젝트에서 API를 통해 챔피언 상세 정보를 가져오는 과정에서 "Access Denied" 오류가 발생하는 문제를 경험했습니다. 아래는 해당 문제를 해결하기 위한 과정과 해결 방법을 설명합니다.

문제 발생 

API를 통해 특정 챔피언의 정보를 가져오려고 할 때, 다음과 같은 오류 메시지가 나타났습니다:

Error fetching champion detail:
Error: Failed to fetch champions: <?xml version="1.0" encoding="UTF-8"?>
<Error><Code>AccessDenied</Code><Message>Access Denied</Message>...

 

오류의 주요 원인은 API 요청이 Access Denied로 차단되면서 발생한 것으로 보입니다. 요청한 URL이 잘못되었거나 권한 문제가 있을 수 있음을 나타냅니다.

 

문제 상황

처음에는 챔피언의 ID 값을 사용하여 리그 오브 레전드 챔피언의 상세 정보를 API로부터 요청하려고 했습니다. 예를 들어, Aatrox 챔피언의 ID 값을 이용해 다음과 같은 URL로 데이터를 요청했습니다.

https://ddragon.leagueoflegends.com/cdn/14.19.1/data/ko_KR/champion/266.json

 

하지만 이 방법으로는 데이터를 제대로 불러오지 못했고, 요청을 보낼 때마다 에러가 발생했습니다.

문제 원인

에러가 발생한 이유는 API에서 챔피언의 ID가 아니라 챔피언의 이름을 사용하여 데이터를 제공하기 때문입니다. 즉, 챔피언의 ID가 아닌 이름을 기반으로 요청 URL을 구성해야만 올바른 데이터를 받을 수 있었습니다.

해결 과정

문제의 원인을 파악한 후, ID 값 대신 챔피언의 이름을 사용하여 URL을 수정했습니다. Aatrox 챔피언의 정보를 가져오기 위해 다음과 같이 URL을 구성했습니다:

https://ddragon.leagueoflegends.com/cdn/14.19.1/data/ko_KR/champion/Aatrox.json

 

이제, 챔피언의 이름을 사용하여 데이터를 요청하면 정상적으로 상세 정보를 불러올 수 있었습니다.

코드 수정 예시

다음은 데이터를 요청하는 로직을 챔피언의 이름을 사용하도록 수정한 코드입니다:

const fetchChampionData = async (championName) => {
  const url = `https://ddragon.leagueoflegends.com/cdn/14.19.1/data/ko_KR/champion/${championName}.json`;

  try {
    const response = await fetch(url);
    const data = await response.json();
    console.log('챔피언 정보:', data);
    return data;
  } catch (error) {
    console.error('챔피언 정보를 불러오는데 실패했습니다:', error);
  }
};

fetchChampionData('Aatrox'); // Aatrox 챔피언 정보 가져오기

배운 점

이 경험을 통해, 챔피언 데이터를 가져오는 API에서는 ID 대신 이름을 사용해야만 정확한 응답을 받을 수 있다는 점을 배웠습니다. 프로젝트 내의 모든 관련 로직을 챔피언 이름을 기반으로 데이터를 요청하도록 수정하여, 같은 문제가 재발하지 않도록 개선했습니다.

이러한 작은 변화가 전체 시스템의 안정성과 효율성을 높이는 데 중요한 역할을 했습니다.