反应-内在-网络视图的反向监测

概览

Real User Monitor(RUM)允许您监视网页浏览并消除混合反应原生应用程序中的盲点.

您可以进行以下活动:

• 跟踪移动应用程序中跨越网络和本地组件的用户行程
• 移动应用程序中网页或本地组件存在延迟的根本原因范围
• 支持在移动设备上装入网页有困难的用户

RUM 支持使用 反应-本地-网络视图。 。 。 .

设置

先决条件

将 RUM 浏览器 SDK 设置在您想要在移动 React Natural 应用程序上渲染的网页上 。 更多信息见 RUM 浏览器监视器。 。 。 .

添加 react-native-webview 您的应用程序 正式安装文件。 。 。 .

输入您的网页视图

导入 WebView 从 @datadog/mobile-react-native-webview 改为 react-native-webview数字 :

import { WebView } from '@datadog/mobile-react-native-webview';
// or
import WebView from '@datadog/mobile-react-native-webview';

您可以使用全部已有的功能 react-native-webview 作为 WebView 构成部分从 @datadog/mobile-react-native-webview 覆盖 react-native-webview 组件.

使用 allowedHosts 弹道 WebView 组件 :

<WebView
    source={{ uri: 'https://www.example.com' }}
    allowedHosts={['example.com']}
/>

访问您的网页视图

您的网页视图出现在 RUM 探索器 关联 service 财务报告和审定财务报表 source 属性。 这个 service 属性表示网络视图生成的网络组件,以及 source 属性表示移动应用程序的平台,如React Native.

过滤您的 React 本地应用程序,然后单击会话 。 出现了一个附有会议活动清单的侧面小组.

igg src=" real user 监测/反应 inative/反应 webview session.png" alt="webview会话实例"

点击 打开视图瀑布 从会话到资源瀑布可视化 业绩 选项卡.