- 필수 기능
- 시작하기
- Glossary
- 표준 속성
- Guides
- Agent
- 통합
- 개방형텔레메트리
- 개발자
- Administrator's Guide
- API
- Datadog Mobile App
- CoScreen
- Cloudcraft
- 앱 내
- 서비스 관리
- 인프라스트럭처
- 애플리케이션 성능
- APM
- Continuous Profiler
- 스팬 시각화
- 데이터 스트림 모니터링
- 데이터 작업 모니터링
- 디지털 경험
- 소프트웨어 제공
- 보안
- AI Observability
- 로그 관리
- 관리
Real User Monitoring allows you to monitor web views and eliminate blind spots in your hybrid mobile applications.
You can perform the following:
You can also record the entire user journey across both web and native views on iOS or Android and watch it in a single Session Replay. Learn how to instrument consolidated browser and mobile web views.
Set up the RUM Browser SDK on the web page you want rendered on your mobile application. For more information, see RUM Browser Monitoring.
DatadogWebViewTracking
as a dependency (iOS or Kotlin Multiplatform only)To enable Web View tracking, make sure to also enable RUM and, or Logs. Then, add the package according to your dependency manager and update your initialization snippet.
Set up the RUM Browser SDK for the web page you want rendered on your mobile application. For more information, see RUM Browser Monitoring.
Set up the RUM Browser SDK on the web page you want rendered on your mobile application. For more information, see RUM Browser Monitoring.
To enable Crash Reporting:
DatadogWebViewTracking
as a dependency, as shown below.You can use CocoaPods to install dd-sdk-ios
:
pod 'DatadogWebViewTracking'
To integrate using Apple’s Swift Package Manager, add the following as a dependency to your Package.swift
:
.package(url: "https://github.com/Datadog/dd-sdk-ios.git", .upToNextMajor(from: "2.0.0"))
In your project, link the following libraries:
DatadogCore
DatadogWebViewTracking
You can use Carthage to install dd-sdk-ios
:
github "DataDog/dd-sdk-ios"
In Xcode, link the following frameworks:
DatadogWebViewTracking.xcframework
Set up the RUM Browser SDK on the web page you want rendered on your mobile application. For more information, see RUM Browser Monitoring.
Set up the RUM Browser SDK on the web page you want rendered on your mobile application. For more information, see RUM Browser Monitoring.
Add DatadogWebViewTracking
library to your application by following the guide here.
If you want to forward RUM events coming from web pages, download the latest version of RUM Android SDK and setup RUM feature following the dedicated guide.
If you want to forward Log events coming from web pages, download the latest version of Logs Android SDK and setup Logs feature following the dedicated guide.
Add the Gradle dependency by declaring the dd-sdk-android-webview
library as a dependency in the module-level build.gradle
file:
dependencies {
implementation "com.datadoghq:dd-sdk-android-webview:x.x.x"
}
Enable tracking for web views with the following code snippet:
WebViewTracking.enable(webView, allowedHosts)
allowedHosts
matches the given hosts and their subdomain. No regular expression is allowed.
Note: In order for instrumentation to work on the WebView component, it is very important that the JavaScript is enabled on the WebView. To enable it, you can use the following code snippet:
webView.settings.javaScriptEnabled = true
The RUM iOS SDK provides APIs for you to control web view tracking. To enable Web View Tracking, provide the WKWebView
instance.
import WebKit
import DatadogWebViewTracking
let webView = WKWebView(...)
WebViewTracking.enable(webView: webView, hosts: ["example.com"])
To disable Web View Tracking:
WebViewTracking.disable(webView: webView)
allowedHosts
matches the given hosts and their subdomain. No regular expression is allowed.
The RUM Flutter SDK provides APIs for you to control web view tracking when the webview_flutter
or the flutter_inappwebview
package.
To add Web View Tracking when using webview_flutter
, add the following to your pubspec.yaml
with the most recent version of the datadog_webview_tracking
plugin:
dependencies:
datadog_webview_tracking: ^x.x.x
Then, call the trackDatadogEvents
extension method on WebViewController
, providing the list of allowed hosts.
For example:
import 'package:datadog_flutter_plugin/datadog_flutter_plugin.dart';
webViewController = WebViewController()
..setJavaScriptMode(JavaScriptMode.unrestricted)
..trackDatadogEvents(
DatadogSdk.instance,
['myapp.example'],
)
..loadRequest(Uri.parse('myapp.example'));
Note that JavaScriptMode.unrestricted
is required for tracking to work on Android.
allowedHosts
matches the given hosts and their subdomain. No regular expression is allowed.
To add Web View Tracking when using flutter_inappwebview
, add the following to your pubspec.yaml
with the most recent version of the datadog_inappwebview_tracking
plugin:
dependencies:
datadog_webview_tracking: ^x.x.x
To instrument an InAppWebView
, add the DatadogInAppWebViewUserScript
to your initialUserScripts
, and call the trackDatadogEvents
extension method during the onWebViewCreated
callback:
InAppWebView(
// Other settings...
initialUserScripts: UnmodifiableListView([
DatadogInAppWebViewUserScript(
datadog: DatadogSdk.instance,
allowedHosts: {'shopist.io'},
),
]),
onWebViewCreated: (controller) async {
controller.trackDatadogEvents(DatadogSdk.instance);
},
)
To instrument an InAppBrowser
, add an override for onBrowserCreated
and call the trackDatadogEvents
extension method on webViewController
, then add a DatadogInAppWebViewUserScript
to the initialUserScripts
when creating your custom InAppBrowser
:
class MyInAppBrowser extends InAppBrowser {
MyInAppBrowser({super.windowId, super.initialUserScripts});
@override
void onBrowserCreated() {
webViewController?.trackDatadogEvents(DatadogSdk.instance);
super.onBrowserCreated();
}
}
// Browser creation
_browser = MyInAppBrowser(
initialUserScripts: UnmodifiableListView(
[
DatadogInAppWebViewUserScript(
datadog: DatadogSdk.instance,
allowedHosts: {'shopist.io'},
),
],
),
);
The allowedHosts
parameter of DatadogInAppWebViewUserScript
matches the given hosts and their subdomain. No regular expression is allowed.
Add react-native-webview
to your application following the official installation documentation.
Import WebView
from @datadog/mobile-react-native-webview
instead of react-native-webview
:
import { WebView } from '@datadog/mobile-react-native-webview';
// or
import WebView from '@datadog/mobile-react-native-webview';
You can use all existing functionalities from react-native-webview
as the WebView
component from @datadog/mobile-react-native-webview
wraps the react-native-webview
component.
Provide the list of hosts to be tracked by Datadog inside the web view by using the allowedHosts
prop of your WebView
component:
<WebView
source={{ uri: 'https://www.example.com' }}
allowedHosts={['example.com']}
/>
allowedHosts
matches the given hosts and their subdomain. No regular expression is allowed.
If you want to forward RUM events coming from web pages, download the latest version of the RUM Kotlin Multiplatform SDK and set up RUM by following the dedicated guide.
If you want to forward log events coming from web pages, download the latest version of the Logs Kotlin Multiplatform SDK and set up logs by following the dedicated guide.
Add the Gradle dependency for the common source set by declaring the dd-sdk-kotlin-multiplatform-webview
library as a dependency in the module-level build.gradle.kts
file:
kotlin {
// ...
sourceSets {
commonMain.dependencies {
implementation("com.datadoghq:dd-sdk-kotlin-multiplatform-webview:x.x.x")
}
}
}
Enable tracking for web views with the following code snippet:
// call it in Android or iOS source set, not in the common one
WebViewTracking.enable(webView, allowedHosts)
Disable tracking of web views once web view instance can be released (iOS only):
// call it in iOS source set, not in the common one
WebViewTracking.disable(webView, allowedHosts)
allowedHosts
matches the given hosts and their subdomain. No regular expressions are allowed.
Your web views appear in the RUM Explorer with associated service
and source
attributes. The service
attribute indicates the web component the web view is generated from, and the source
attribute denotes the mobile application’s platform, such as Android.
To access your web views:
Navigate to Digital Experiences > Real User Monitoring > (Sessions) Explorer.
Create a query to filter on the following:
application.id
or application.name
service
source
Note: If you see unrecognized version numbers reporting in your mobile app, they may belong to the Browser SDK version. In that case, you can filter out the Browser platform session. For example, source: react-native
.
Click a session. A side panel with a list of events in the session appears.
Any service with the web icon indicates a webview.
From here, you can hover over a session event and click Open View waterfall to navigate from the session to a resource waterfall visualization in the view’s Performance tab.
See RUM & Session Replay Billing for details on how web views in mobile applications impact session recordings and billing.
추가 유용한 문서, 링크 및 기사: