Skip to content
No description, website, or topics provided.
HTML Objective-C JavaScript Java
Branch: master
Clone or download

Latest commit

Fetching latest commit…
Cannot retrieve the latest commit at this time.

Files

Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
android
iOS
wrapper
.gitignore
.npmignore
LICENSE
README.md
index.android.js
package.json

README.md

1. 리액트 플러그인 설치 (AOS/IOS 공통 설정)

1.1 플러그인 다운로드

터미널에서 아래의 명령어를 통해 리액트 플러그인을 프로젝트에 다운로드 합니다.

$ npm install --save git+https://github.com/WisetrackerTechteam/Tracker-react-package.git

1.2 플러그인 설치 확인

프로젝트에 플러그인이 정상 다운로드되면 다음과 같이 플러그인 파일이 추가된 것을 확인할 수 있습니다.

1.3 Wisetracker AppKey 발급

http://report.wisetracker.co.kr 로그인

설정 > 기본설정 > 서비스 > Android 분석코드 (AppKey) 클릭 > AppKey 복사 후 적용

Appkey 등록

2. Android 리액트 플러그인 설정

a) App Key 등록

<!-- 발급 받은 AppKey meta-data 추가 -->
<meta-data
    android:name="WiseTrackerKey"
    android:value="YOUR_APP_KEY" />

b) Http 통신 허용 설정

코르도바 안드로이드 프로젝트의 targetSdkVersion 28 이상일 경우 http 통신 허용 설정을 해야 합니다.

<!-- AndroidManifest.xml -->
<application
	android:icon="@mipmap/ic_launcher"
	android:label="@string/app_name"
	android:networkSecurityConfig="@xml/network_security_config"
	android:theme="@style/AppTheme">
<!-- app/res/xml/network_security_config.xml -->
<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">www.wisetracker.co.kr</domain>
        <domain includeSubdomains="true">trk.wisetracker.co.kr</domain>
    </domain-config>
</network-security-config>

c) 디버깅 모드 설정

<!-- 개발용 true 배포용 false 권장 -->
<meta-data 
	android:name="WiseTrackerLogState" 
	android:value="true" />

d) 딥링크 설정

딥링크로 진입할 android:scheme="YOUR_SCHEME" 스키마와 android:host="YOUR_HOST" 호스트를 설정해 주세요.

<!-- 예시는 wisetracker://wisetracker.co.kr 링크로 진입시 딥링크 분석이 가능하며, 사용될 값을 직접 수정해 주세요. -->
<activity android:name="kr.co.wisetracker.tracker.DeepLinkActivity" 
          android:launchMode="singleTop" >
    <intent-filter>
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />
	<!-- 딥링크로 진입될 스키마와 호스트 정보 입력 -->
        <data android:host="wisetracker.co.kr"
              android:scheme="wisetracker" />
    </intent-filter>
</activity>

3. IOS 리액트 플러그인 설정

3.1 XCode 프로젝트 세팅: 아래의 화면과 같이 설치한 플러그인 폴더 아래에 있는 파일들 중 아래 4가지 파일들을 프로젝트 경로에 가져다 놓습니다.(Drag & Drop)

3.2 http 통신 허용 설정
  • http통신을 허용하기 위해 info.plist파일에 NSAppTransportSecurity를 아래와 같이 추가합니다
	<key>NSAppTransportSecurity</key>
	<dict>
		<key>NSAllowsArbitraryLoads</key>
		<true/>
	</dict>

3.3 info.plist파일 디버깅 모드 세팅

info.plist 파일을 open할때 list로 보기가 아니라 source로 보기를 선택한 후, 아래와 같이 추가합니다

// 개발용 true. 배포용 false 권장
    <key>WiseTrackerLogState</key>
    <string>true</string>

3.4 외부 유입 경로 분석 ( Deeplink )

앱이 설치된 이후 DeepLink를 통해서 앱이 실행되는 경로 분석이 필요한 경우 네이티브 프로젝트의 AppDelegate 정의 항목중 openURL 함수 구현부에 아래와 같이 추가해줍니다.

#import<WiseTracker/WiseTracker.h> 추가

iOS 4.2–9.0
-(BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation{
	[WiseTracker urlRefererCheck:sourceApplication url:url];
	return YES;
}

OR

iOS 9.0+
- (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options {
    [WiseTracker urlRefererCheck:@"" url:url];
    return YES;

}

4. 플러그인 초기화

리액트 프로젝트에서 앱 시작시 최초 로드되는 .js 파일에 플러그인을 초기화하는 코드를 추가합니다.

import Wisetracker from 'react-plugin/wrapper/bridge.js';

componentDidMount() {
    Wisetracker.setWisetrackerAppkey("YOUR_APP_KEY");   // 앱키 입력
    Wisetracker.initialization();  			// 초기화 함수 호출
    Wisetracker.startPage("YOUR_PAGE_VALUE"); 		// 페이지 정보 입력
}
You can’t perform that action at this time.