@amplitude/plugin-session-replay- react-native (英语)

原生反射的振幅会话重放插件

安装

npm install @amplitude/plugin-session-replay-react-native

使用量

将会话重放插件添加到您的振幅实例如下

import { SessionReplayPlugin } from '@amplitude/plugin-session-replay-react-native';

// ...

const config: SessionReplayConfig = {
    enableRemoteConfig: true, // default true
    sampleRate: 1, // default 0
    logLevel: LogLevel.Warn, // default LogLevel.Warn
    privacyConfig: { maskLevel: 'medium' }, // 'medium' is the default
};
await init('YOUR_API_KEY').promise;
await add(new SessionReplayPlugin(config)).promise;

遮罩级别

控制会话如何激烈地通过 privacyConfig.maskLevel 配置选项 :

import { SessionReplayPlugin } from '@amplitude/plugin-session-replay-react-native';

const config: SessionReplayConfig = {
    privacyConfig: { maskLevel: 'conservative' }, // mask all text and inputs
};

说明: 绕过 UIKit/ Android 标准文本视图的第三方文本渲染器( 例如) react-native-svg, (中文(简体) ), @shopify/react-native-skia)不通过自动蒙面检测出. 将内容包入 <AmpMaskView mask="amp-mask"> 手动遮住.

遮掩视图

要掩盖某些观点,请添加 AmpMaskView 带有口罩属性的标签 amp-mask 被蒙上面具的部分

import { AmpMaskView } from '@amplitude/plugin-session-replay-react-native';

// ...

<AmpMaskView mask="amp-mask">
    <Text
    style={[
        styles.sectionTitle,
        {
        color: isDarkMode ? Colors.white : Colors.black,
        },
    ]}
    >
    {title}
    </Text>
</AmpMaskView>

解密视图

要解析视图,请添加 AmpMaskView 带有口罩属性的标签 amp-unmask 在区域周围被解开

import { AmpMaskView } from '@amplitude/plugin-session-replay-react-native';

// ...

<AmpMaskView mask="amp-unmask">
    <Text
    style={[
        styles.sectionTitle,
        {
        color: isDarkMode ? Colors.white : Colors.black,
        },
    ]}
    >
    {title}
    </Text>
</AmpMaskView>

跟踪网页视图 (Beta)

网页视图默认被屏蔽,不会被跟踪. 如果你想跟踪网页视图,你可以通过下列操作手动解析它们

<AmpMaskView mask="amp-unmask" style={{ flex: 1 }}>
    <WebView source={{ uri: 'https://reactnative.dev/' }} style={{ flex: 1 }} />
</AmpMaskView>