메타프레임 메서드 및 이벤트 살펴보기

window.metaframe 개체

스크립트가 로드되면 애플리케이션의 글로벌 window 개체에서 metaframe 개체를 사용할 수 있습니다. 메타프레임 개체에는 웹 애플리케이션에서 메타프레임을 관리하는 데 필요한 메서드 목록이 포함되어 있습니다.

window.metaframe.create 메서드

메서드 시그니처:

window.metaframe.create: (parameters: {
 loginProjectId: string,
 merchantId?: number,
 projectId?: number,
 orbsApiHostId?: string,
 isMobile?: boolean,
 isCollapsed?: boolean,
 layoutSettings?: {
     desktop: {
       widgetMarginTop?: number,
     },
     mobile: {
       widgetMarginTop?: number,
     },
   },
}) => void;

웹 애플리케이션에서 메타프레임을 초기화합니다.

window.metaframe.setIsMobile 메서드

메서드 시그니처:

window.metaframe.setIsMobile(isMobile: boolean)

메타프레임을 데스크톱에서 모바일 버전으로 또는 그 반대로 전환합니다.

window.metaframe.partnerActions 개체

이 개체에는 메타프레임에서 동작을 트리거하는 메서드가 포함되어 있습니다.

이 개체의 메서드를 사용하기 전에 메타프레임이 완전히 로드되었는지 확인해야 합니다. 이렇게 하려면 메타프레임 로드 이벤트를 구독합니다. 이벤트가 처리되면 개체의 메서드를 사용할 수 있습니다.

메타프레임 로드 이벤트에 리스너를 설정하는 예시:

window.addEventListener("@metaframe-partner-events:app-loaded", () => {

 //Here you can use partner actions

});

window.metaframe.partnerActions.openBackpackItemPage 메서드

메서드 시그니처:

openBackpackItemPage: (itemId: string) => void;

Backpack 섹션에서 지정한 항목의 페이지를 엽니다.

메서드가 적절히 작동하려면 다음 조건이 충족되어야 합니다:

• 관리자 페이지에서 Backpack 기능이 활성화됩니다.
• 사용자가 메타프레임 측에서 인증됩니다.

window.metaframe.partnerActions.openLogin 메서드

메서드 시그니처:

openLogin: () => void;

사용자 권한 부여 양식을 엽니다. 사용자에게 이미 권한이 부여된 경우 브라우저 콘솔에 오류가 표시됩니다.

window.metaframe.partnerActions.openProfile 메서드

메서드 시그니처:

openProfile: () => void;

현재 사용자의 Profile 섹션을 엽니다. 사용자에게 권한이 없는 경우 브라우저 콘솔에 오류가 표시됩니다.

window.metaframe.partnerActions.openWallet 메서드

메서드 시그니처:

openWallet: () => void;

현재 사용자의 Wallet 섹션을 엽니다. 사용자에게 권한이 없는 경우 브라우저 콘솔에 오류가 표시됩니다.

window.metaframe.partnerActions.openBackpack 메서드

메서드 시그니처:

openBackpack: () => void;

현재 사용자에 대한 Backpack 섹션을 엽니다. 사용자에게 권한이 없는 경우 브라우저 콘솔에 오류가 표시됩니다.

window.metaframe.partnerActions.openCustomMiniApp 메서드

메서드 시그니처:

openCustomMiniApp: (params: {miniAppName: string}) => void;

다음 조건 중 하나가 충족되면 Iframe 유형으로 지정된 사용자 지정 섹션을 엽니다:

• 지정된 사용자 지정 섹션 설정의 사용자 로그인 이전에 이 앱 표시 토글이 활성화될 경우 현재 사용자에게 권한이 부여되지 않습니다.
• 지정된 사용자 섹션 설정의 사용자 로그인 후 이 앱 표시 토글이 활성화될 경우 현재 사용자에게 권한이 부여됩니다.

조건이 충족되지 않으면 브라우저 콘솔에 오류가 표시됩니다.

window.metaframe.partnerActions.pushNotification 메서드

메서드 시그니처:

pushNotification: (params: {
  type: string; // use “success”, “warning”, “error” or “info”
  text: string;
  button?: {
    text: string;
    onClick: () => void;
  };
  durationInMs?: number;
}) => void;

새 알림을 알림 스택으로 푸시합니다.

window.metaframe.partnerActions.setIsCustomMiniAppVisible 메서드

메서드 시그니처:

setIsCustomMiniAppVisible: (params: {
  miniAppName: string;
  isVisible: boolean;
}) => void;

지정된 사용자 지정 섹션을 표시하거나 숨깁니다.

위젯 이벤트

다음 메타프레임 이벤트를 구독할 수 있습니다:

사용자 지정 섹션의 이벤트 추적

메타프레임에 작업 유형이 있는 사용자 지정 섹션을 추가할 수 있습니다. 이 섹션은 클릭 시 웹사이트 열기와 같은 작업을 수행하는 버튼으로 표시됩니다.

사용자 지정 섹션 클릭 이벤트를 추적하려면 @metaframe:custom-action:<ACTION_ID> 이벤트를 구독해야 합니다. 여기에서, <ACTION_ID>는 사용자 지정 섹션 설정 시 관리자 페이지에 생성된 작업 ID입니다.

사용자 지정 섹션 클릭 이벤트에 대한 리스너 설정 예시:

document.addEventListener("@metaframe:custom-action:00000000-0000-0000-0000-000000000000", () => {

 // Your code here...

})