이 문서는 채널톡 React Native SDK (이하 SDK)의 ChannelIO에 대해 설명합니다.

boot

SDK를 사용하기 위해 필요한 정보를 로드합니다. 부트를 성공한 이후에는 채널톡의 기능을 사용할 준비를 마칩니다.더 자세한 내용은 부트를 참고합니다.

매개변수	타입	필수 여부	설명
bootConfig	`object`	O	부트 설정입니다. 플러그인 키, 채널톡 버튼 위치 등을 설정합니다.
bootCallback	`((BootStatus, User?) -> Void)?`	X	부트 상태와 유저 정보를 반환합니다.

const config = {
  "pluginKey": YOUR_PLUGIN_KEY,
  "memberId": MEMBER_ID,
  "memberHash": MEMBER_HASH,
  "profile": {
    "name": NAME,
    "email": EMAIL,
    "mobileNumber": "+~~~",
    "avatarUrl": AVATAR_URL,
    OTHER_KEY: OTHER_VALUE,
  },
  "language": LANGUAGE, // "en", "ko", "jp"
  "unsubscribeEmail": BOOLEAN,
  "unsubscribeTexting": BOOLEAN,
  "trackDefaultEvent": BOOLEAN,
  "hidePopup": BOOLEAN,
  "channelButtonOption": {
    "xMargin": 16,
    "yMargin": 16,
    "position": POSITION,  // "left", "right"
  },
  "appearance": APPEARANCE // "system", "light", "dark" 
}

ChannelIO.boot(config).then((result) => {
  // result.status
  // result.user
})

sleep

시스템 푸시 알림 수신과 track을 제외한 모든 기능을 비활성화 합니다. 채널톡 서버와의 소켓 통신이 끊기기 때문에 실시간 기능 사용이 불가능합니다. 더 자세한 안내는 라이프 사이클을 참조합니다.

ChannelIO.sleep();

shutdown

SDK와 채널과의 연결을 끊습니다. SDK의 모든 기능 사용이 중단됩니다. 더 자세한 안내는 라이프 사이클을 참조합니다.

ChannelIO.shutdown();

showChannelButton

전역 화면에 채널 버튼을 표시합니다.

ChannelIO.showChannelButton();

hideChannelButton

전역 화면에서 채널 버튼을 숨깁니다.

ChannelIO.hideChannelButton();

showMessenger

메신저를 표시합니다.

ChannelIO.showMessenger();

hideMessenger

메신저를 닫습니다.

ChannelIO.hideMessenger();

openChat

유저챗을 엽니다. 새로운 상담을 열거나, 기존에 존재하는 유저챗을 열 수 있습니다.

매개변수	타입	필수 여부	설명
chatId	`string \| undefined`	X	채팅의 ID 입니다. `chatId`가 유효하지 않거나, `undefined` 인 경우 새로운 유저챗을 엽니다.
message	`string \| undefined`	X	새로 채팅을 여는 경우, 메시지 입력창에 미리 입력되어 있는 메시지입니다. `chatId`가 `undefined`인 경우 유효합니다.

// Open chat id is '123'
ChannelIO.openChat("123", null);

// Same as ChannelIO.openChat("123", null);
// When chat id parameter is not null, message parameter is ignored.
ChannelIO.openChat("123", "asd");

// Open new chat like click start new chat in home
ChannelIO.openChat(null, null);

// Open new chat with "123" in input box. 
// If support bot is enabled, open support bot instead.
ChannelIO.openChat(null, "123");

track

유저의 이벤트를 트래킹합니다. 더 자세한 안내는 이벤트 트래킹 문서를 참조합니다.

매개변수	타입	필수 여부	설명
eventName	`string`	O
eventProperty	`object \| undefined`	X

// Only send event name
ChannelIO.track(EVENT_NAME);

// Send event with properties
ChannelIO.track(
  EVENT_NAME, 
  { 
    PROPERTY_KEY_1: STRING_VALUE, 
    PROPERTY_KEY_2: INT_VALUE
  }
);

setPage

track 이 호출 될 때의 화면 이름을 설정합니다. setPage 보다 먼저 track 을 호출하는 경우 이벤트에 페이지 정보가 반영되지 않습니다.

매개변수	타입	필수 여부	설명
page	`string \| null`	X

ChannelIO.setPage(page)

resetPage

track 이 호출 될 때의 화면 이름을 초기화 합니다. 기본 설정은 track을 호출하는 ViewController 또는 Activity의 이름입니다.

ChannelIO.resetPage()

updateUser

유저 정보를 수정합니다.

매개변수	타입	필수 여부	설명
userData	`object`	O

const user = {
  "language": LANGUAGE, // "ko", "jp", "en"
  "tags": ["1", "2", "3"],
  "profile": {
    "name": NAME,
    "email": EMAIL,
    "mobileNumber": '+~~~',
    "avatarUrl": AVATAR_URL,
    OTHER_KEY: OTHER_VALUE,
  },
  "profileOnce": {
  },
  "unsubscribed": BOOLEAN,
};
ChannelIO.updateUser(user).then((result) => {
  // result.error
  // result.user
});

addTags

유저에게 태그를 추가합니다.

매개변수	타입	필수 여부	설명
tags	`string[]`	O

let tags = ["1", "2", "3"];
ChannelIO.addTags(tags).then((result) => {
  // result.error
  // result.user
});

removeTags

유저의 태그를 제거합니다. 존재하지 않는 태그는 무시합니다.

매개변수	타입	필수 여부	설명
tags	`string[]`	O

let tags = ["1", "2"];
ChannelIO.removeTags(tags).then((result) => {
  // result.error
  // result.user
});

initPushToken

디바이스 토큰에 대한 변경 사항을 채널톡에 전달합니다.

매개변수	타입	필수 여부	설명
token	`string`	O

import messaging from '@react-native-firebase/messaging';
import {ChannelIO} from 'react-native-channel-plugin';

componentDidMount() {
  this.onRefreshListener = messaging().onTokenRefresh(fcmToken => {
    ChannelIO.initPushToken(fcmToken);
  });
}

componentWillUnmount() {
  this.onRefreshListener();
}

isChannelPushNotification

SDK가 처리해야 하는 푸시 데이터인지 확인합니다.

매개변수	타입	필수 여부	설명
userInfo	`object`	O

import messaging from '@react-native-firebase/messaging';
import {ChannelIO} from 'react-native-channel-plugin';

componentDidMount() {
    this.backgroundMessageHandler = messaging().setBackgroundMessageHandler(
      async (remoteMessage) => {
        // this line:
        ChannelIO.isChannelPushNotification(remoteMessage.data).then((result) => {
            if (result) {
              ChannelIO.receivePushNotification(remoteMessage.data).then((_) => { });
            } else {
              // TODO : Your FCM code
            }
          },
        );
      },
    );
}

componentWillUnmount() {
  this.backgroundMessageHandler();
}

receivePushNotification

채널톡에 유저가 푸시 알림을 받았음을 전달합니다.

매개변수	타입	필수 여부	설명
userInfo	`object`	O

import messaging from '@react-native-firebase/messaging';
import {ChannelIO} from 'react-native-channel-plugin';

componentDidMount() {
    this.backgroundMessageHandler = messaging().setBackgroundMessageHandler(
      async (remoteMessage) => {
        ChannelIO.isChannelPushNotification(remoteMessage.data).then((result) => {
            if (result) {
              // this line:
              ChannelIO.receivePushNotification(remoteMessage.data).then((_) => { });
            } else {
              // TODO : Your FCM code
            }
          },
        );
      },
    );
}

componentWillUnmount() {
  this.backgroundMessageHandler();
}

hasStoredPushNotification

디바이스에 저장된 채널 푸시 정보가 있는지 확인합니다.

if (ChannelIO.hasStoredPushNotification()) {
  ChannelIO.openStoredPushNotification();
}

openStoredPushNotification

receivePushNotification을 통해 디바이스에 저장 된 푸시 정보를 이용하여 유저챗을 엽니다.

if (ChannelIO.hasStoredPushNotification()) {
  ChannelIO.openStoredPushNotification();
}

isBooted

부트가 된 상태인지 확인합니다.

ChannelIO.isBooted().then((result) => {
  // boolean
});

setDebugMode

디버그 모드를 설정합니다. true로 설정한 경우 로그 메시지가 표시됩니다.

매개변수	타입	필수 여부	설명
enable	`boolean`	O

ChannelIO.setDebugMode(true);

setAppearance

SDK의 테마를 설정합니다.

매개변수	타입	필수 여부	설명
appearance	`Appearance`	O	"light"와 "dark" 로 명시하는 경우 해당 속성으로 테마를 고정합니다. "system" 인 경우 기기의 시스템 테마를 따릅니다.

ChannelIO.setAppearance("light")