iOS

Cordova에 IMQA 설치하기

이 문서는 cordova에 IMQA SDK를 적용하는 방법을 제공합니다.

1. SDK 설치

1. <PROJECT-NAME>.xcworkspace 파일을 열어줍니다.

2. ios 폴더 아래에 frameworks라는 폴더를 만듭니다.

3. 아래 링크를 통해 원하시는 버전의 프레임워크를 설치 받아 Xcode 상에 frameworks 폴더에 프레임워크 파일을 옮기면서 Copy Items If needed 를 체크합니다.

• https://github.com/onycom-imqa/IMQA-MPM-Release/releases

• https://github.com/onycom-imqa/IMQA-Crash-Release/releases

4. 프로젝트 셋팅에서 Frameworks, Libraries, and Embedded Content 에서 프레임워크를 전부 Embed & Sign 으로 설정합니다.

2. SDK 설정

1. AppDelegate.m 파일에서 아래 2개를 임포트하세요.

AppDelegate.m

#import <IMQAMPMAgent/IMQAMPMAgent.h>
#import <IMQACrashAgent/IMQACrash.h>

2. AppDelegate.m 파일에서 - (BOOL)application:(UIApplication*)application didFinishLaunchingWithOptions:(NSDictionary*)launchOptions 함수 가장 상단에 아래 코드를 추가합니다.

AppDelegate.m

NSString* PROJECT_KEY = @"<PROJECT_KEY>";

IMQACrashConfiguration* crashConfig = [[IMQACrashConfiguration alloc] initWithApiKey:PROJECT_KEY];
[IMQACrash startWithConfiguration:crashConfig];

IMQAConfig* mpmConfig = [[IMQAConfig alloc] init:PROJECT_KEY];
[[IMQAMpm sharedInstance] runWithConfig:mpmConfig];

3. 빌드 후 실행 시켰을 때 아래와 같은 로그가 확인이 되면 정상적으로 설치가 완료되었습니다.

AppDelegate.m

[IMQACrash] [INFO] Sent session AC868F82-97E7-4DAA-A75B-E6E5CEB64F46

[IMQA] (1/4) Start tracking viewcontroller
[IMQA] (2/4) Start tracking network
[IMQA] (3/4) Start tracking resource
[IMQA] (4/4) Start tracking backtrace
[IMQA] (4/4) Complete setting IMQA MPM
[IMQA] IMQA MPM Version : <VERSION>

3. Cordova 설정

1. HTML 가장 상단에 Webview Agent 설치합니다. (설치 후 빌드 필수)

index.html

<!-- IMQA Webview Agent(1.1.3버전 이하) 입니다. -->
<script type="text/javascript" src="https://imqawebviewagent.blob.core.windows.net/agent/webview-agent-1.1.2.js"
crossorigin></script>

// min 파일로 적용하고 싶을 경우
<script type="text/javascript" src="https://imqawebviewagent.blob.core.windows.net/agent/webview-agent-1.1.2.min.js"
crossorigin></script>

index.html

<!-- IMQA Webview Agent (1.1.3버전 이상) 입니다. -->
<script type="text/javascript" src="https://cdn.imqa.io/agent/webview-agent-1.1.3.js"
crossorigin></script>

<script>
    ((w, c, _wv, _w, _wk, _mh, _b) => {        
       w[_wv](w); // 웹뷰 에이전트 실행함수
    })(window, 'imqaClientConfig', 'IMQAWebviewMain', 'IMQAWebMain', 'webkit', 'messageHandlers', 'ImqaBridge')
</script>

2. Xcode에서 CordovaLib/Private/Plugins/CDVWebViewEngine/CDVWebViewEngine.m 파일을 찾습니다.

3. CDVWebViewEngine.m 에 상단에 MPM SDK을 임포트합니다.

CDVWebViewEngine.m

#import <IMQAMPMAgent/IMQAMPMAgent.h>

4. - (void)pluginInitialize 함수에서 WKUserContentController 을 수정하는 부분을 찾아 수정합니다.

CDVWebViewEngine.m

// 기존코드
WKUserContentController* userContentController = [[WKUserContentController alloc] init];
[userContentController addScriptMessageHandler:weakScriptMessageHandler name:CDV_BRIDGE_NAME];
// 추가코드
[userContentController addScriptMessageHandler:self name:@"ImqaBridge"];

5. - (void)userContentController:(WKUserContentController*)userContentController didReceiveScriptMessage:(WKScriptMessage*)message 함수를 찾아 수정합니다.

***반드시 해당 함수 가장 상단에 추가 해야합니다.***

CDVWebViewEngine.m

if([message.name isEqual: @"ImqaBridge"]) {
 [[IMQAMpm sharedInstance] saveWebviewPostMessage:(CDVViewController*)self.viewController :message.body];
}