[버그] 샌드박스 앱에서 fetch 응답 JSON에 “data” 필드가 있으면 앱 크래시 발생

개발
1

이 글의 성격은 무엇인가요?

질문 / 문제 해결

내용을 설명해주세요

[버그] 샌드박스 앱에서 fetch 응답 JSON에 “data” 필드가 있으면 앱 크래시 발생

안녕하세요, 앱인토스 미니앱 개발 중 발견한 이슈를 공유드립니다.

환경 정보

  • 개발 환경: React Native
  • SDK 버전:
    • @apps-in-toss/framework: 1.14.1
    • @granite-js/native: 0.1.34
    • @granite-js/react-native: 0.1.34
    • react-native: 0.72.6
  • 테스트 환경:
    • iOS 실기기용 샌드박스 앱: 크래시 발생
    • 실 토스 앱 QR 테스트: 정상 동작

증상

미니앱의 RN 레이어에서 fetch()를 호출했을 때, 응답 JSON에 "data" 필드가 포함되어 있으면 샌드박스 앱이 크래시됩니다.

JS의 try-catch로 잡히지 않으며, 네이티브 레벨에서 크래시가 발생합니다. 실 토스 앱에서는 동일한 코드가 정상 동작합니다.

재현 코드

try {
  // 응답이 {"data": "1"} 인 엔드포인트 → 샌드박스에서 크래시
  const res = await fetch('https://example.org/');
  console.log('응답:', res.status);
} catch (e) {
  // 여기에 도달하지 못하고 앱이 크래시됨
  console.error('에러:', e);
}

테스트 결과

응답 본문 결과
pong (평문) 정상
{"hello": "world"} 정상
{"data1": "1"} 정상
{"code": 200} 정상
{"data": "1"} 크래시
{"data": "hello"} 크래시
{"code":200000,"message":"OK","data":"..."} 크래시

JSON 응답에 정확히 "data" 라는 키가 존재할 때만 크래시가 발생합니다.

추정 원인

샌드박스 앱의 네이티브 네트워크 레이어에서 fetch 응답을 인터셉트하여 JSON을 파싱하고, "data" 필드를 내부적으로 처리하는 로직이 있는 것으로 보입니다. 해당 처리 과정에서 예외 없이 크래시가 발생하는 것으로 추정됩니다.

영향

샌드박스 환경에서 외부 API를 호출할 때, 응답에 "data" 필드가 포함된 경우 디버깅 및 테스트가 불가능합니다. 많은 REST API가 {"data": ...} 형태의 응답 구조를 사용하고 있어 영향 범위가 넓을 수 있습니다.

2

## 해결됨

SDK 2.0.1로 마이그레이션 후 해당 이슈가 해결되었습니다.

- **변경 전:** SDK 1.14.1 (`@granite-js/*`: 0.1.34, `react-native`: 0.72.6)

- **변경 후:** SDK 2.0.1 (`@granite-js/*`: 1.0.4, `react-native`: 0.84.0)

기존 샌드박스 앱에서 fetch 응답 JSON에 `“data”` 필드가 포함되면 크래시가 발생했으나, SDK 2.0.1 마이그레이션 후 정상 동작합니다.

SDK 1.x 환경에서만 발생하는 이슈였던 것으로 보입니다.

3

@seop 님 안녕하세요

해결이 되어 다행이에요, 공유주셔서 감사합니다 :folded_hands: