Javascript Ajax Json Jsonp

JSONP를 AJAX 요청에 사용하지 말아야 할 이유는 무엇인가요?

웹 개발자로서 우리의 주요 목표 중 하나는 우리가 만드는 애플리케이션이 기능적이고, 효율적이며, 안전하도록 하는 것입니다. AJAX 요청을 다룰 때 자주 등장하는 일반적인 기술 중 하나가 JSONP(Padding이 포함된 JSON)입니다. 주로 크로스 도메인 요청을 수행할 때 사용되며, JSONP는 <script> 태그가 모든 도메인에서 콘텐츠를 로드할 수 있다는 사실을 이용합니다. 하지만 크로스 도메인 상황이 아닌 경우에도 JSONP를 피해야 할 정당성이 있을까요?

이번 포스트에서는 AJAX 앱에 JSONP를 포함하기 전에 다시 생각해봐야 할 이유를 깊이 파고들어 보겠습니다.

JSONP란 무엇인가요?

JSONP는 Padding이 포함된 JSON을 의미합니다. 이는 개발자가 자신이 만든 애플리케이션과 다른 도메인에 있는 서버에서 데이터를 요청할 수 있도록 해주는 방법입니다. 이 방법은 웹 브라우저에 내장된 동일 출처 정책을 우회하여, 이러한 요청을 차단하지 않도록 합니다.

여기 JSONP 요청이 어떻게 생겼는지를 간단히 보여주는 예시가 있습니다:

function handleResponse(data) {
    console.log(data);
}

let script = document.createElement('script');
script.src = 'https://example.com/data?callback=handleResponse';
document.body.appendChild(script);

JSONP 사용의 단점

사용하기 간편하고 크로스 도메인 문제를 교묘하게 우회할 수 있지만, JSONP는 단점도 존재합니다. 고려해야 할 몇 가지 중요한 요소는 다음과 같습니다:

1. 오류 처리 부족

  • JSONP의 주요 우려 사항 중 하나는 오류 처리의 부재입니다.
  • 요청 중 오류가 발생하면 JavaScript 코드 내에서 이를 포착할 수 있는 방법이 없습니다. 명확한 오류 응답 대신 올바르게 작동하거나 작동하지 않는 스크립트 주입만 받습니다.
  • 이를 관리하기 위해서는 서버에서 항상 제대로 형식화된 JSON 응답을 반환하도록 해야 합니다.

2. 보안 취약점

  • 외부 소스에서 스크립트를 동적으로 실행하는 모든 방법과 마찬가지로, JSONP는 잠재적인 보안 문제를 야기할 수 있습니다.
  • 공격자가 호출하는 서비스에 대해 제어권을 잡고 악성 스크립트를 반환할 수 있는 가능성도 있습니다.
  • 위험을 완화하기 위해 서버 측 스크립트에서 리퍼러를 확인할 수 있지만 완벽한 방법은 아닙니다.

3. 브라우저 동작의 변동성

  • 동적으로 생성된 <script> 태그의 동작은 다양한 브라우저에서 다를 수 있습니다. 사용자가 선택한 브라우저에 따라 예기치 않은 결과에 직면할 수 있습니다.

4. 제한된 유연성

  • JSONP에서는 XMLHttpRequest 또는 fetch와 같은 다른 방법처럼 요청을 쉽게 취소하거나 재시도할 수 없습니다.
  • 이러한 비유연성은 진행 중인 요청을 우아하게 처리해야 하는 상황을 초래할 수 있으며, 이는 애플리케이션의 로직을 복잡하게 만들 수 있습니다.

5. 디버깅의 어려움

  • JSONP로 인해 발생하는 문제를 디버깅하는 것은 종종 더 어려울 수 있습니다. 오류는 전통적인 AJAX 요청처럼 반환되지 않습니다.

결론

JSONP를 사용하는 것은 크로스 도메인 요청을 다룰 때는 종종 빠른 해결책처럼 보일 수 있습니다. 그러나 잠재적인 보안 위험, 오류 처리 부족 및 앞서 언급한 기타 제한점을 평가할 때, 이러한 접근 방식이 모든 애플리케이션에 가장 적합하지 않을 수 있음을 알 수 있습니다—특히 크로스 도메인 기능이 필요하지 않을 때는 더욱 그렇습니다.

CORS 또는 표준 AJAX 요청과 같은 다른 기술을 탐색해보는 것이 좋습니다. 이들은 보다 강력하고 안전한 대안을 제공할 수 있습니다. 프로젝에 맞는 올바른 접근 방식을 결정하기 전에 장단점을 평가하는 것이 언제나 좋습니다.

JSONP와 같은 도구의 잠재적인 단점에 대해 잘 알고 있음으로써, 애플리케이션의 기능성과 보안을 우선시하는 보다 현명한 결정을 내릴 수 있습니다.