알립니다
하이브리드 앱 설정을 하기 전에 앱과 웹사이트에 각각 코도바-Ionic SDK 와 웹 SDK 를 설치해 주세요.
하이브리드 앱에서 웹 사이트 코드를 변경하지 않아도 에어브릿지 코도바-아이오닉 SDK가 인앱 웹 사이트에서 발생하는 에어브릿지 관련 작업을 처리하도록 설정할 수 있습니다.
코도바-아이오닉 SDK는 웹 SDK에서 진행되는 이벤트 전송, 디바이스 설정, 유저 설정에 관한 명령을 대신 처리할 수 있습니다. 웹뷰에 웹 사이트를 표시하기 전에 Airbridge.createWebInterfaceScript
함수와 Airbridge.handleWebInterfaceCommand
함수를 이용해 설정해 주세요.
webToken
은 웹 SDK 토큰입니다. 웹 SDK 토큰은 에어브릿지 대시보드의 [설정]>[토큰 관리]에서 확인할 수 있습니다.
postMessageScript
는 웹 SDK가 코도바-아이오닉 SDK에 전달하는 명령어가 저장된 payload
변수를 리액트 네이티브 영역에 전달하는 자바스크립트 코드입니다.
command
는 웹 SDK가 코도바-아이오닉 SDK에 전달하는 명령어입니다.
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));
}
}
아래 사항을 주의해 주세요.
하이브리드 앱 설정을 하면 웹 SDK만으로 인앱 웹뷰에서 발생하는 이벤트를 수집해야 합니다. 앱 SDK로 이벤트를 추가로 수집하면 해당 이벤트가 중복해서 집계됩니다.
인앱 웹뷰에 실제 모바일 웹사이트를 사용하면 웹 SDK만으로 이벤트를 수집해 주세요.
도움이 되었나요?
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));
}
}