Session replay installation

I only see blank screen on session recordings of my Flutter app. What might be the issue? I set up everything. I can see all the interactions but recordings are blank.

    return MaterialApp.router(
      scrollBehavior: AppScrollBehavior(),
      debugShowCheckedModeBanner: false,
      routerDelegate: appRouter.delegate(
        navigatorObservers: () => [
          PosthogObserver(),
        ],
      ),

Here is the initialization

  Future<void> initialize() async {
    if (_initialized) return;

    try {
      final config = PostHogConfig(AppConfigs.posthogApiKey);
      config.host = AppConfigs.posthogHost;
      config.debug = kDebugMode;
      config.captureApplicationLifecycleEvents = true;
      config.sessionReplay = true;
      config.sessionReplayConfig.maskAllImages = false;
      config.sessionReplayConfig.maskAllTexts = false;
      config.personProfiles = PostHogPersonProfiles.always;

      await Posthog().setup(config);
      _initialized = true;

      AppLogger.info('PostHog initialized successfully');
    } on Exception catch (e) {
      AppLogger.error('Error initializing PostHog: $e');
    }
  }

Hi everyone,

I’ve been going through the documentation but can’t seem to find anything that explains how to enable screenshot mode. Is there any resource or guidance on how to enable this option to record session replays for a SwiftUI in an iOS app?

Any help or pointers would be really appreciated!

Thanks in advance.

All of the replays looks just black screen from the past 3 days. we did added cloudfront, might be related? also and we are using local proxy for sending the requests to posthog (using react router v7 framework mode), but its been a few weeks with the proxy and everything worked as expected.

MacOS Sonoma 14.7.2 on an Apple M1 Pro.

I am unable to build my Expo/React Native project when using posthog-react-native-session-replay version 1.0.2 or 1.0.3. Version 1.0.0 works. I am getting the error below when building locally, but it works to build on EAS.

--- xcodebuild: WARNING: Using the first of multiple matching destinations: { platform:iOS Simulator, id:575932BE-0EB5-498E-8869-CF963E8C3C1C, OS:17.5, name:iPhone SE (3rd generation) } { platform:iOS Simulator, id:575932BE-0EB5-498E-8869-CF963E8C3C1C, OS:17.5, name:iPhone SE (3rd generation) } ** BUILD FAILED **

The following build commands failed: SwiftEmitModule normal arm64 Emitting\ module\ for\ posthog_react_native_session_replay (in target 'posthog-react-native-session-replay' from project 'Pods') SwiftCompile normal arm64 /node_modules/posthog-react-native-session-replay/ios/PosthogReactNativeSessionReplay.swift (in target 'posthog-react-native-session-replay' from project 'Pods') Building workspace AppName with scheme AppName and configuration Debug (3 failures)

How do I mask images in session recordnig?

Is it possible to mask images in session recording?

How do I disable session recording on some sensitive screens of my Flutter app? We wouldn't want to see or record the user password on login screen when he is typing.

We are testing out posthog-react-native-session-replay ^0.1.9 and we noticed that redacted data isn't actually redacted during some animations. The black rectangles stays in place while the screen itself is moving. Is this a known issue? Not being able to redact data properly makes it hard to use the feature in accordance with GDPR

In my React Native app, I need to block certain pages, such as the payment page, from being recorded. How can I prevent session recording on specific pages in my app?

I'm working with PostHogAndroid and I have session replay and events setup. I noticed I was not getting any session replays if I instantiated PostHogAndroid using the with() function provided in the SDK. Is there anyway to get around this, I'd like to not refactor our analytics service in order to accommodate session replays.

Hi, I'm working on implementing session replay in a React Native app and noticed that while Android and iOS support wireframe mode, Ract Native doesn't. May I know what's the reason for this?

Going into the implementation via RN, I assume that it uses the Android and iOS SDKs to power it. Some clarifications on how this SDK is implemented would be great and whether the wireframe mode is in the pipeline for RN (performance is important for mobile as the beautiful blog post written pointed out by PostHog).

Thank you!

Hi, I'm encountering an issue while integrating session replay into my app. After installing posthog-react-native-session-replay and building the app, I get the error: 'react/renderer/animations/primitives.h' file not found. I'm using Expo prebuild. Has anyone faced a similar issue or have any insights on how to resolve this?!

Hi, is there any way to enable/disable session recording manually via posthog for React native SDK.

https://posthog.com/tutorials/limit-session-recordings

The functions mentioned here are not available in React Native SDK.

import React, { useEffect } from "react"; import { Stack } from "expo-router"; import { SafeAreaProvider } from "react-native-safe-area-context"; import { useRouter } from "expo-router"; import { AuthProvider, useAuth } from "../src/context/auth"; import { ActivityIndicator, AppState, View } from "react-native"; import { ThemeProvider } from "./ThemeContext"; import { usePostHog, PostHogProvider } from 'posthog-react-native'

function RootLayoutNav() { const { isLoggedIn, token, isLoading } = useAuth(); const router = useRouter();

useEffect(() => { if (!isLoading) { if (isLoggedIn && token) { router.replace("/(home)/home"); } else { router.replace("/(auth)/login"); } } }, [isLoggedIn, token, isLoading, router]);

if (isLoading) { return ( <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}> ); }

return ( <Stack screenOptions={{ headerShown: false }}> <Stack.Screen name="(auth)" /> ); }

export default function RootLayout() {

const posthog = usePostHog();

useEffect(() => { const handleAppStateChange = (nextAppState) => { if (nextAppState === 'active') { posthog?.capture('App Became Active'); } else if (nextAppState === 'background') { posthog?.flush(); } };

const subscription = AppState.addEventListener('change', handleAppStateChange);

return () => {
  subscription.remove();
};

}, [posthog]);

return ( <PostHogProvider apiKey="phc_5I....kjj" options={{ host: 'https://us.i.posthog.com', enableSessionReplay: true, }} autocapture={true} debug >

I use a paid subscription. • How can I increase the session replay retention to one year? • I know that I can download a session using the specific API, but my question is: how can I replay this session? For instance, if I download the session from the API and save it in my database, how can I replay it later?

I have disabled the recording session for my project, but I am unable to see the recording session. I got the message "Recording not found. It might be lost in space." I am not able to figure out what to do. Could you please help me understand what I did wrong?

Hi, I followed the setup guide to enable session replays in our expo react native app and enabled session replays in our posthog project configuration. We have autocapture enabled but mainly use custom events / screen captures. We have installed the session replay package and enabled it within posthog. Then we pushed to test flight and open testing for the play store to test the setup and session recording features, but sadly no session replays have been recorded. I'm wondering if you are able to help me understand why the sessions are not being recorded in the app.

If I can provide any further info let me know. Looking forward to your help!

Hello hi! I noticed that the sessions recordings do not load correctly the font used for the website, is there some configuration needed so that we can see the session more in line with the experience of the website? btw amazing product, liking it so far :)

I can send events, but is there an option to record an electron app session?

Hello

Is there a plan for session replay to be released for react-native web?