하이브리드 앱 설정하기 - 코도바-아이오닉 SDK

알립니다

하이브리드 앱 설정을 하기 전에 앱과 웹사이트에 각각 코도바-Ionic SDK웹 SDK 를 설치해 주세요.

하이브리드 앱에서 웹 사이트 코드를 변경하지 않아도 에어브릿지 코도바-아이오닉 SDK가 인앱 웹 사이트에서 발생하는 에어브릿지 관련 작업을 처리하도록 설정할 수 있습니다.

코도바-아이오닉 SDK로 웹 SDK 동작 처리하기

코도바-아이오닉 SDK는 웹 SDK에서 진행되는 이벤트 전송, 디바이스 설정, 유저 설정에 관한 명령을 대신 처리할 수 있습니다. 웹뷰에 웹 사이트를 표시하기 전에 Airbridge.createWebInterfaceScript 함수와 Airbridge.handleWebInterfaceCommand 함수를 이용해 설정해 주세요.

webToken웹 SDK 토큰입니다. 웹 SDK 토큰은 에어브릿지 대시보드의 [설정]>[토큰 관리]에서 확인할 수 있습니다.

postMessageScript 는 웹 SDK가 코도바-아이오닉 SDK에 전달하는 명령어가 저장된 payload 변수를 리액트 네이티브 영역에 전달하는 자바스크립트 코드입니다.

command 는 웹 SDK가 코도바-아이오닉 SDK에 전달하는 명령어입니다.

123456789101112131415161718192021222324252627
async function open() {
    const script = await Airbridge.createWebInterfaceScript(
        'YOUR_WEB_SDK_TOKEN',
        (function (arg) {
            return `window.cordova_iab.postMessage(${arg})`;
        })
    );

    var url = 'https://...';
    var target = ;
    var options = 
    var inAppBrowserRef = cordova.InAppBrowser.open(url, target, options);

    inAppBrowserRef.addEventListener('loadstart', loadstartCallback);
    inAppBrowserRef.addEventListener('loadstop', ...);
    inAppBrowserRef.addEventListener('loaderror', ...);
    inAppBrowserRef.addEventListener('exit', ...);
    inAppBrowserRef.addEventListener('message', messageCallBack);

    function loadstartCallback(event) {
        inAppBrowserRef.executeScript({ code : script });
    }

    function messageCallBack(params){
        Airbridge.handleWebInterfaceCommand(JSON.stringify(params.data));
    }
}

주의사항

아래 사항을 주의해 주세요.

도움이 되었나요?

더 필요한 내용이 있나요?