tencent cloud

문서Tencent Cloud Observability Platform

SDK Initialization

다운로드
포커스 모드
폰트 크기
마지막 업데이트 시간: 2026-05-25 18:01:57
This article describes how to initialize the RUM Pro React Native SDK.

Sample Code

Before initializing, ensure that you have created a product in RUM Pro Creating an Application and obtained the corresponding AppKey and AppID. Then, initialize the SDK using the following code.
import Aegis, { BUGLY_SERVER_HOST } from 'bugly-rn-sdk';
// Optional. Used to obtain the device's network information.
import netInfo from '@react-native-community/netinfo';

const aegis = new Aegis({
id: 'xxxx', // The app id of the integrated product. Required.
appKey: 'xxxxxxx', // The app key of the integrated product. Required.
aid: "deviceID", // The device ID. It should be unique for different devices. Recommended.
env: "debug", // The log level for sdk console output. "debug" outputs all logs. The default value is "production", which outputs only error logs during sdk runtime. Optional.
serverHost: BUGLY_SERVER_HOST.OA, // The reporting domain. Required.
netInfo: netInfo, // Optional. Network information can be obtained after it is passed in.
plugin:{
error: true, // Enable error monitoring.
}
});
Note:
The SDK uses @react-native-community/netinfo to obtain network information. If this third-party library is not available, the returned network category is unknown.
When aid is not set during aegis initialization, the SDK randomly generates a device ID. The SDK uses @react-native-async-storage/async-storage to persistently store the device ID. If this third-party library is not available, the SDK generates a different device ID each time the application starts.
React Native primarily uses the following third-party libraries to implement page navigation: React Navigation and React Native Navigation. You can enable the SDK's page visit feature by following the instructions below.

React Navigation

Set up the page navigation feature for your React Native application.
import { NavigationContainer, useNavigationContainerRef } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
function App() {
const Stack = createNativeStackNavigator();
const containerRef = useNavigationContainerRef();
return (<NavigationContainer
ref = {containerRef}
onReady={
() => {
// Enable the page visit feature using wrapNavigationRef.
aegis.wrapNavigationRef(containerRef);
}
}
>
<Stack.Navigator initialRouteName="Home">
<Stack.Screen name="Home" component={HomeScreen} />
</Stack.Navigator>
</NavigationContainer>
);
}

React Native Navigation

Pass in the Navigation from the React Native Navigation library during aegis initialization.
import { Navigation } from 'react-native-navigation';
const aegis = new Aegis({
// The configuration items are the same as those for SDK initialization.
navigation: Navigation,
});


도움말 및 지원

문제 해결에 도움이 되었나요?

피드백