모바일 세션 리플레이

사용자가 어떤 경험을 했는지 정확히 볼 수 있는데, 왜 찾기 힘든 모바일 앱 버그를 재현하려고 몇 시간을 허비하겠습니까? 모바일 세션 리 문제플레이는 최종 사용자가 휴대폰이나 태블릿에서 본 내용을 해당 세션의 모든 텔레메트리 데이터와 동기화하여 비디오 재생을 제공함으로써 진단에 대한 추측을 제거하고 문제를 해결합니다. 즉, 버그 보고서나 로컬 재현에 의존하지 않고도 사용자에게 미치는 오류의 실제 영향을 신속하게 평가하고 성능 병목현상, 병목지점 및 UX 마찰 지점을 식별하고 문제를 더 빠르게 해결할 수 있습니다.

요구 사항 및 호환성

모바일 세션 리플레이를 설정하기 전에 앱이 다음 요구 사항을 충족하는지 확인하세요.

기술적 전제 조건

모바일 세션 리플레이를 사용하려면 다음이 필요합니다.

• 모바일 예측이 활성화된 뉴렐릭 계정
• 뉴렐릭으로 구성된 활성 모바일 기능
• 모바일 앱에서 뉴렐릭의 데이터 수집까지의 네트워크 연결 엔드포인트

성능 고려 사항

모바일 세션 리플레이를 활성화하기 전에 앱과 사용자에 대한 다음 영향을 고려하세요.

• 앱 성능: 세션 리플레이는 뷰포트 데이터를 캡처하고 전송하며, 이는 구형 기기의 앱 성능에 영향을 미칠 수 있습니다.
• 데이터 소모: 재생 데이터 전송은 특히 이미지가 캡처될 때 사용자 데이터를 소모합니다.
• 저장 요구 사항: 캡처된 데이터는 전송 주기 사이에 사용자 장치에 적절한 저장 용량이 필요합니다.
• 네트워크 최적화: 모든 데이터는 네트워크 사용량을 최소화하기 위해 전송 전에 클라이언트 측에서 압축됩니다.
• 샘플링 전략: 데이터 수집 요구 사항과 성능 영향의 균형을 맞추기 위해 샘플링 속도를 신중하게 고려하세요.

지원되는 UI 프레임워크

세션 리플레이는 현재 iOS, Android 및 리액트된 앱용 UI 프레임워크를 선택하여 지원됩니다. 우리는 더 많은 UI와 하이브리드 프레임워크를 지원하기 위해 적극적으로 노력하고 있습니다.

현재 지원됨:

• iOS UIKit
• iOS SwiftUI
• 안드로이드 XML 레이아웃
• 안드로이드 Jetpack Compose
• 리액트에 의한 조회수

계획된 지원:

• 웹뷰
• 실룩 거리다
• 코르도바
• 콘덴서
• 마우이

최소 에이전트 버전

다음은 기본 세션 리플레이 캡처를 지원하는 최초 에이전트 버전입니다.

• iOS 에이전트 v7.5.10이 2025년 9월 15일에 출시되었습니다.
• 안드로이드 에이전트 v7.6.8 2025년 7월 29일 출시
• 리액트 작용 에이전트 v1.5.10 출시일: 2025년 9월 15일

모바일 세션 리플레이 작동 방식

모바일 세션 리플레이의 작동 방식을 이해하면 개인 정보 보호 설정 및 문제 해결, 해결에 대해 정보에 입각한 결정을 내리는 데 도움이 됩니다.

귀하의 앱이 사용자 기능을 시작하면 모바일 에이전트는 뉴렐릭 서버에 호출하여 세션 리플레이가 활성화되어 있는지 확인하고, 활성화되어 있다면 샘플링 비율과 개인 정보 보호 설정이 무엇인지 확인합니다. 에이전트는 샘플링 결정을 내리고 재생 데이터 캡처를 시작합니다.

브라우저 세션 리플레이와 달리 모바일 앱에는 캡처하고 다시 만들 수 있는 DOM 없습니다. 대신 모바일 에이전트는 뷰 라이프사이클을 모니터링하고 뷰포트를 HTML로 변환합니다. 마스킹 설정은 뷰포트의 HTML 재생성에 적용되고, 이후 JSON으로 직렬화되어 1분마다 데이터 전송이 트리거될 때까지 클라이언트 측에 저장됩니다. 이때 페이로드가 압축되어 뉴렐릭으로 전송됩니다.

앱이 예기치 않게 충돌하거나 중단되는 경우, 마지막 성공적인 전송 주기와 예기치 않은 앱 종료 사이에 수집된 데이터는 다음 앱이 출시될 때까지 클라이언트 측에 저장되며, 모바일 에이전트는 버려진 데이터를 복원하고 업로드하려고 시도합니다. iOS와 Android가 예기치 않은 종료를 처리하는 방식으로 인해 예기치 않은 앱 종료 후에 모든 데이터를 복구할 수 없는 경우가 있습니다.

뉴렐릭 UI 에서 리플레이를 볼 때 JSON은 NRDB에서 가져와서 HTML 업데이트 스트림으로 역직렬화되어 웹 브라우저에서 재생되는 "비디오"를 구성합니다.

네이티브 플랫폼 뷰 프레임워크에서 HTML로 변환되었기 때문에 모바일 세션 리플레이는 일반적으로 정확하지만 픽셀 단위로 완벽하지는 않습니다. 우리는 리플레이의 정확성을 개선하기 위해 지속적으로 노력할 것입니다.

모바일 세션 설정 리플레이

세션 리플레이 활성화, 샘플링 속도 및 대부분의 개인 정보 보호 설정은 뉴렐릭의 전형적인 설정 페이지에서 서버 측에서 관리되므로 업데이트는 새 앱 버전의 구현, 배포 및 채택에 종속되지 않습니다. 일부 유형의 마스킹 재정의만 코드에서 관리해야 합니다.

개인정보 보호 및 마스킹

귀하의 개인정보 보호 요구 사항에 가장 적합한 마스킹 전략을 선택하세요.

마스킹 전략

모바일 세션 리플레이는 개인 정보 보호와 리플레이 유용성의 균형을 맞추기 위해 두 가지 마스킹 전략을 제공합니다. 귀하의 선택에 따라 세션 녹화에서 민감한 데이터가 처리되는 방식이 결정됩니다.

기본 마스킹 전략

기본 마스킹 전략은 예외 없이 모든 텍스트와 이미지를 마스킹하여 최대한의 개인 정보 보호를 제공합니다. 다음과 같은 경우 이 전략을 선택하세요:

• 귀하의 앱은 매우 민감한 데이터(의료, 금융 서비스 등)를 처리합니다.
• 규정 준수에는 엄격한 데이터 보호가 필요합니다.
• 개인 정보를 유출할 위험이 전혀 없기를 원합니다.

가려지는 내용:

• 모든 텍스트는 별표로 대체됩니다(예: "hello"는 "*****"로 변경됨)
• 모든 이미지는 동일한 크기의 플레이스홀더 블록으로 대체됩니다.
• 사용자 탭과 스와이프는 여전히 캡처됩니다(숨기지 않는 한)

이렇게 하면 실수로 마스크 해제 코드를 추가하더라도 기본 전략에 따라 항상 모든 항목이 마스크됩니다.

기본 마스킹 전략의 중요한 제한 사항:

• 마스킹 모드는 구성할 수 없습니다.
• 인라인 마스킹 재정의(예: nr-unmask 태그)는 무시됩니다.
• 서버 측 마스킹 규칙은 효과가 없습니다.

맞춤형 마스킹 전략

사용자 정의 마스킹 전략을 사용하면 마스크되는 내용과 표시되는 내용을 세부적으로 제어할 수 있습니다. 다음과 같은 경우 이 전략을 사용하세요.

• 귀하의 앱에는 공개 콘텐츠와 민감한 콘텐츠가 혼합되어 있습니다.
• 문제를 효과적으로 진단하려면 특정 UI 요소를 확인해야 합니다.
• 민감하지 않은 영역을 선택적으로 가리고 싶습니다.

맞춤형 전략은 다음으로 구성됩니다.

1. 마스킹 모드: 다양한 콘텐츠 유형(텍스트, 이미지, 복합체 합성)에 대한 기반 규칙
2. 재정의 규칙: 특정 구성 요소를 마스크하거나 마스크 해제하는 예외

사용자 정의 마스킹으로 전환하려면:

뉴렐릭 웹 인터페이스에서:

1. Mobile > [사용자의 분리] > Settings > Application > Session Replay로 이동하세요.
2. Masking strategy [마스킹 전략] 섹션에서 Custom [사용자 지정을]선택하세요.
3. 마스킹 모드 구성(다음 섹션 참조)
4. 선택적으로 특정 구성 요소에 대한 재정의 규칙을 추가합니다.

마스킹 모드

사용자 정의 마스킹 전략을 사용할 때 마스킹 모드는 세션 리플레이에 대한 기준 개인 정보 보호 동작을 설정합니다. 이러한 모드는 개별 구성 요소에 대한 특정 규칙에 의해 재정의되지 않는 한 앱 전체에 전역적으로 적용됩니다.

마스킹 모드를 구성하려면:

뉴렐릭 웹 인터페이스에서:

1. Mobile > [사용자의 분리] > Settings > Application > Session Replay로 이동하세요.
2. Custom [사용자 정의] 마스킹 전략이 선택되었는지 확인하세요.
3. Masking modes [마스킹 모드] 섹션에서 필요에 따라 각 모드를 켜거나 끕니다.
4. 모든 새 세션 녹음에 대한 변경 사항은 즉시 적용됩니다.

4가지 마스킹 모드는 다양한 유형의 콘텐츠를 제어합니다.

사용자 입력 텍스트 마스크

사용자가 입력 필드에 입력한 텍스트를 리플레이에서 볼 수 있는지 여부를 제어합니다.

활성화된 경우(권장):

• 사용자가 입력한 모든 문자는 별표로 대체됩니다.
• 예: 사용자가 "john.doe@email.com"을 입력합니다. → 리플레이에서는 "*********************"로 나타납니다.
• 사용자 이름, 이메일 주소, 검색 쿼리, 양식 데이터 및 기타 사용자가 입력한 콘텐츠를 보호합니다.

비활성화 시:

• 사용자가 입력한 텍스트는 재생에 입력한 것과 정확히 동일하게 나타납니다.
• 입력 필드에 민감하지 않은 정보가 포함된 경우에만 사용하세요.
• 양식 검증 문제나 검색 기능 디버깅에 유용합니다.

기본 설정: 사용자 정의 마스킹 전략에서 활성화됨.

이 모드를 비활성화할 수 있는 경우:

• 개인 식별이 불가능한 쿼리가 있는 공개 검색 창
• 민감하지 않은 필터 또는 카테고리 선택
• 자동완성 또는 입력 검증 문제 디버깅

마스크 제작 텍스트

애플리케이션에서 표시하는 텍스트(레이블, 버튼, 헤더, 콘텐츠)가 리플레이에서 표시되는지 여부를 제어합니다.

활성화 시:

• 앱에서 렌더링된 모든 정적 및 동적 텍스트는 별표로 대체됩니다.
• 예: "이름:" 레이블은 재생 시 "***********"로 변경됩니다.
• 민감한 정보를 포함하거나 공개할 수 있는 모든 텍스트를 보호합니다.

비활성화 시:

• 모든 애플리케이션 텍스트는 사용자가 보는 그대로 표시됩니다.
• 라벨, 버튼, 제목 및 콘텐츠는 완전히 읽을 수 있습니다.
• 리플레이를 훨씬 더 쉽게 이해하고 탐색할 수 있습니다.
• 사용자가 상호 작용한 화면이나 기능을 식별하는 데 필수적입니다.

기본 설정: 사용자 정의 마스킹 전략에서 활성화됨.

대부분 앱에 대한 권장 사항: 매우 민감한 정보를 표시하지 않는 한 이 모드를 비활성화하세요. 눈에 보이는 UI 텍스트는 다음과 같은 경우에 중요합니다.

• 사용자 탐색 경로 이해
• 사용자가 클릭한 버튼이나 기능 식별
• 나타난 오류 메시지를 보고
• 레이아웃 또는 현지화 문제 진단
• 특정 앱 기능과 리플레이 상관 관계

다음과 같은 경우 이 모드를 활성화해 두세요.

• 환자 정보를 표시하는 의료 앱
• 계좌 세부 정보나 거래를 보여주는 금융 앱
• 민감할 수 있는 사용자 생성 콘텐츠가 있는 앱
• 규정 준수 요구 사항에 따라 표시된 모든 텍스트를 마스킹해야 합니다.

마스크 이미지

애플리케이션의 이미지를 캡처하여 리플레이에 표시할지 여부를 제어합니다.

활성화된 경우(권장):

• 모든 이미지는 동일한 크기의 플레이스홀더 블록으로 대체됩니다.
• 플레이스홀더는 레이아웃 구조를 유지하므로 이미지 위치를 볼 수 있습니다.
• 뉴렐릭에는 이미지 데이터가 전송되지 않습니다.
• 사용자가 업로드한 사진, 프로필 사진 및 잠재적으로 민감한 이미지를 보호합니다.

비활성화 시:

• 이미지는 캡처되고 압축되고 base64로 인코딩되어 재생 페이로드에 포함됩니다.
• 리플레이에서는 사용자가 본 것보다 낮은 품질로 이미지가 나타납니다.
• 데이터 전송 및 저장 비용이 크게 증가합니다.
• 이미지 로딩, 렌더링 또는 레이아웃 문제를 진단하는 데 도움이 됩니다.

기본 설정: 사용자 정의 마스킹 전략에서 활성화됨.

이 모드를 비활성화할 수 있는 경우:

• 이미지 로딩 실패 또는 렌더링 문제 진단
• 이미지 크기와 관련된 레이아웃 문제 조사
• 이미지 갤러리나 미디어 콘텐츠를 이용한 사용자 복합 복합 이해
• 귀하의 앱은 공개적이고 민감하지 않은 이미지(아이콘, 로고, 일러스트레이션)만 표시합니다.

다음과 같은 경우 이 모드를 활성화해 두세요.

• 사용자 프로필 사진 또는 업로드된 사진
• 앱 내에서 캡처한 문서 또는 스크린샷
• 의료 영상 또는 의료 관련 영상
• 사용자가 생성한 모든 시각적 콘텐츠

사용자 탭 및 스와이프 숨기기

리플레이에서 사용자 터치 상호작용을 시각화할지 여부를 제어합니다.

비활성화된 경우(권장):

• 사용자 탭은 리플레이에서 회색 원으로 나타납니다.
• 스와이프 제스처는 동작 경로를 나타내는 빨간색 선으로 나타납니다.
• 사용자가 어떤 UI 요소와 상호 작용했는지 이해하는 데 필수적입니다.
• 사용성 문제, 놓친 탭 또는 혼란스러운 안내를 식별하는 데 도움이 됩니다.

활성화 시:

• 리플레이에는 탭이나 스와이프 시각화가 나타나지 않습니다.
• 사용자는 눈에 보이지 않는 확장작용 없이 앱을 탐색하는 것처럼 보입니다.
• 터치 패턴으로 민감한 정보가 노출될 수 있는 경우 사용하세요.

기본 설정: 사용자 지정 마스킹 전략에서 비활성화됨(탭과 스와이프가 표시됨).

대화를 숨길 수 있는 경우: 일반적으로 텍스트를 마스킹하는 것으로 충분하지만, 다음과 같은 경우 탭/스와이프를 숨겨야 할 수 있습니다.

• 귀하의 앱에는 탭 패턴이 보안 코드를 표시하는 통합 PIN 패드 또는 숫자 키패드가 있습니다.
• 스와이프 패턴은 인증에 사용됩니다(패턴 잠금, 제스처 비밀번호)
• 특정 화면에 대한 터치 자극은 민감한 선택(의료 증상 선택, 재정적 결정)을 유추할 수 있습니다.

대부분의 앱에 대한 권장사항:

• 사용자가 탭한 정확한 위치(놓친 영역 또는 응답하지 않는 영역 포함)를 확인하세요.
• 앱의 탐색 패턴과 사용자 흐름을 이해하세요
• 작은 터치 버튼, 목표 또는 불분명한 버튼으로 인한 사용성 문제 식별
• 제스처 기반 기능 진단(스와이프하여 삭제, 당겨서 새로 고침 등)

고급 마스킹 설정

애플리케이션의 특정 부분에 지정된 마스킹 모드와 다른 마스킹 설정을 적용하려는 경우 마스킹 재정의를 사용합니다. 예를 들어, 애플리케이션 대부분에 민감한 데이터가 없는 경우 모드를 마스크 해제로 설정하고, 민감한 데이터가 포함된 애플리케이션 부분만 마스크하도록 재정의를 지정할 수 있습니다.

마스킹 오버라이드 방법

마스킹 재정의 규칙을 만드는 세 가지 방법이 있습니다.

인라인 속성

인라인 마스킹 재정의는 마스크하거나 마스크 해제하려는 구성 요소에 태그를 지정하여 코드에 적용됩니다. 앱의 새 버전을 구현하고 배포해야 하며, 사용자가 업데이트를 적용하도록 해야 하므로 변경 제어 프로세스의 감독을 통해 변경 사항을 마스킹하려는 경우에 가장 적합합니다.

// Mask a composable
Text(
    text = "Sensitive information",
    modifier = Modifier.newRelicMask()
)

// Unmask a composable
Text(
    text = "Public information",
    modifier = Modifier.newRelicUnmask()
)

<EditText
    android:id="@+id/editTextEmail"
    android:layout_width="390dp"
    android:inputType="text"
    android:tag="nr-mask"
    android:importantForAutofill="no" />

<EditText
    android:id="@+id/editTextEmail"
    android:layout_width="390dp"
    android:inputType="text"
    android:tag="nr-unmask"
    android:importantForAutofill="no" />

<View>
  <NewRelicMask>
    <Text>Sensitive information</Text>
  </NewRelicMask>
</View>

<View>
  <NewRelicUnmask>
    <Text>Non-sensitive information</Text>
  </NewRelicUnmask>
</View>

로컬 API 메서드

로컬 API 메소드 마스킹 재정의는 뉴렐릭 에이전트 설정 내의 코드에도 적용됩니다. 태그는 각 뷰에 이미 고유한 식별자가 있고 코드 전체에서 각 뷰를 개별적으로 관리하는 대신 중앙 집중식 목록에서 관리하려는 경우에 유용합니다.

// In your application initialization
NewRelic.addSessionReplayMaskViewTag("sensitive-data")
NewRelic.addSessionReplayUnmaskViewTag("public-data")

// In your composables
Text(
    text = "Sensitive information",
    modifier = Modifier.testTag("sensitive-data")
)

Text(
    text = "Public information",
    modifier = Modifier.testTag("public-data")
)

NewRelic.addSessionReplayMaskViewTag("login");
NewRelic.addSessionReplayUnmaskViewTag("editTextEmail");
NewRelic.addSessionReplayUnmaskViewClass("android.widget.Button");
NewRelic.addSessionReplayMaskViewClass("android.widget.TextView");
NewRelic.addSessionReplayMaskViewClass("com.yourpackagename.CustomView");

서버 측 규칙

서버 측 마스킹 규칙을 사용하면 이미 출시된 앱 버전의 마스킹 실수를 소급적으로 패치할 수 있습니다. 앱을 업데이트하지 않아도 모든 새 세션이 시작되면 즉시 적용됩니다.

규칙은 세 가지 요소로 구성됩니다.

• 유형: 일치하는 구성 요소를 마스크할지 또는 마스크 해제할지 여부를 결정합니다.
• 부대: 요소를 어떻게 처리할지 지정합니다. (예: 클래스별, 태그 등)
• 값: 규칙이 적용될 선택된 식별자의 값

예를 들어, Mask class android.widget.EditText 에 대한 규칙은 Android 앱에서 사용자가 편집할 수 있는 모든 텍스트 필드를 마스크합니다.

새 규칙을 생성하려면:

뉴렐릭 웹 인터페이스에서:

1. Mobile > [사용자의 분리] > Settings > Application > Session Replay 로 이동하세요.
2. Override rules [재정의 규칙] 으로 스크롤하여 Add new override rule [새 재정의 규칙 추가를] 클릭합니다.
3. 규칙 유형(마스크 또는 마스크 해제)을 선택합니다.
4. 던지기, 목표 구성요소에 사용하려는 제외를 선택하세요.
5. 규칙을 적용할 식별자 값을 입력합니다.
6. Add rule [규칙 추가를] 클릭합니다.

새로운 규칙은 재정의 규칙 표에 추가되어 모든 새 세션에 적용됩니다.

규칙을 삭제하거나 편집하려면:

뉴렐릭 웹 인터페이스에서:

1. Mobile > [사용자] > Settings > Application > Session Replay 로 이동하세요.
2. 재정의 규칙 표에서 수정하려는 규칙을 찾습니다.
3. ... 메뉴를 클릭한 다음 Delete [삭제] 또는 Edit [편집을] 선택합니다.

마스킹 규칙 우선순위

여러 마스킹 규칙이 하나의 뷰 또는 요소에 적용되는 경우 다음 우선순위 순서에 따라 어떤 규칙이 적용되는지 결정됩니다.

1. 전략은 모든 것보다 중요하다

   마스킹 전략이 Default 인 경우 모드와 재정의가 적용되지 않습니다.

   예: 코드에 인라인 nr-unmask 속성 재정의를 추가했지만 설정에서 Default 마스킹 전략이 선택된 경우 모든 것이 계속 마스킹됩니다.

2. 오버라이드는 모드를 대체합니다.

   모드는 오버라이드가 없을 때의 표준 동작을 결정하므로 오버라이드가 있는 경우 항상 모드보다 우선합니다.

   예: Mask application text 모드가 활성화되어 있고 코드에서 뷰에 인라인 nr-unmask 속성 재정의를 추가하는 경우 해당 뷰는 마스크 해제되지만 다른 모든 뷰는 마스크됩니다.

3. 마스킹 재정의는 마스킹 해제 재정의보다 우선합니다.

   단일 뷰에 마스킹 및 마스크 해제 재정의가 모두 있는 경우 항상 마스크됩니다.

   예: 뷰에 인라인 nr-unmask 속성 재정의와 nr-mask 서버 측 규칙이 있는 경우 뷰가 마스크됩니다.

세션 리플레이 보기 및 분석

세션 리플레이를 수집하기 시작하면 공통적인 패턴과 사용자 경험 마찰이 발생하는 영역을 식별하여 디지털 경험을 개선하는 데 사용할 수 있습니다. 또한 오류나 예상치 못한 동작이 발생하기 전에 사용자가 취한 단계를 검토하여 문제를 신속하게 진단하고 해결하는 데에도 도움이 됩니다.

세션 리플레이 페이지에서 리플레이 보기

세션 리플레이 페이지는 선택한 기간 동안 수집된 모든 리플레이 목록을 제공합니다. 기본적으로, 우리는 최소 5초 이상 지속된 리플레이를 목록으로 필터링합니다. 이 표는 오류 수와 같은 유용한 데이터 포인트를 제공하며, 필터를 사용하면 문제를 해결하는 데 도움이 되는 세션으로 목록을 좁힐 수 있습니다.

예를 들어, 특정 지역의 리플레이를 보려면 countryCode 필터를 추가하여 현지화가 예상대로 작동하는지 확인할 수 있고, 호환성 문제가 있을 수 있는 특정 휴대폰 모델의 리플레이를 보려면 deviceModel 필터를 추가할 수 있습니다.

세션 리플레이 페이지에 액세스하려면:

뉴렐릭 웹 인터페이스에서:

1. one.newrelic.com > All Capabilities > Mobile 로 이동합니다.
2. 모바일 앱을 선택하세요.
3. 왼쪽 메뉴에서 아래로 스크롤하여 Session replay [세션 재생을] 클릭합니다.
4. 리플레이를 보려면 행을 클릭하세요.

오류 및 성능 문제가 있는 리플레이 보기

현재는 세션 리플레이 메인 페이지에서 리플레이를 볼 수 있습니다. 충돌, 요청 오류, 처리된 예외 및 ANR 환경과의 통합은 미리보기 기간 후반에 제공될 예정입니다.

권한 및 액세스 관리

모바일 세션 리플레이에는 자체적인 권한 집합이 있으므로 리플레이를 볼 수 있는 사람과 설정을 업데이트할 수 있는 사람을 세부적으로 지정할 수 있습니다. 모든 표준 역할을 가진 사용자는 리플레이를 볼 수 있지만, 모든 제품 관리자만 세션 리플레이 설정을 수정할 수 있습니다. 사용자 권한을 더욱 효과적으로 제어하기 위해 사용자 정의 역할을 만들 수 있습니다.

권한 개요

사용자 권한은 Administration > Access management > Roles 에서 찾을 수 있는 사용자 관리 UI에서 관리됩니다.

사용자에게 세션 리플레이 설정 권한과 특수 설정 권한이 모두 필요합니다.