메타프레임을 설정하고 웹 애플리케이션에 추가

관리자 페이지에서 메타프레임 설정

기본 메타프레임 설정 방법:

  1. 프로젝트를 관리자 페이지에서 엽니다.
  2. 사이드 메뉴에서, 메타프레임을 클릭합니다.
  3. 메타프레임 생성을 클릭합니다.
주의
메타프레임 생성 버튼은 라이선스 계약에 서명한 후에만 사용할 수 있습니다.
  1. 메타프레임 활성화 창을 클릭합니다.
  2. 로그인 프로젝트 필드에서, 이전 단계에서 설정한 로그인 프로젝트를 선택합니다.

고급 메타프레임 기능 설정에 대한 자세한 내용은 다음을 참조하십시오:

메타프레임을 웹 애플리케이션에 통합

앱에 메타프레임을 추가하는 방법:

  1. 프로젝트를 관리자 페이지에서 엽니다.
  2. 사이드 메뉴에서, 메타프레임을 클릭합니다.
  3. 스크립트 코드 복사를 클릭합니다.
  4. 다음 방법 중 하나를 사용하여 코드에 스크립트를 추가합니다:
    1. 아래 예시와 같이 애플리케이션이 초기화되기 전에 HTML 파일의 제목 또는 본문에 스크립트를 삽입합니다.
Copy
Full screen
Small screen
<!doctype html>
<html lang="en">
 <head>
   <meta charset="UTF-8" />
   <title>Integration example</title>
 </head>
 <body>
   <script src="https://cdn.xsolla.net/metaframe-web-wallet-widget-prod/container/v1/metaframe.js"></script>
   <script>

     window.metaframe.create({

       loginProjectId: '00000000-0000-0000-0000-000000000000',
       merchantId: 000001,
       projectId: 000001,
       orbsApiHostId: '00000000-0000-0000-0000-000000000000',
       isMobile: false,

     });

   </script>
   <script src="YOUR_APPLICATION_HERE.js"></script>
 </body>
</html>
    1. 애플리케이션의 JS 코드 내부에 스크립트 엘리먼트를 생성하고 아래 예시와 같이 스트립트를 로드한 후 window.metaframe.create 메서드를 호출합니다. 이를 통해 메타프레임 스크립트를 동적으로 로딩할 수 있습니다.
Copy
Full screen
Small screen
const metaframeScript = document.createElement("script");

metaframeScript.src = "https://cdn.xsolla.net/metaframe-web-wallet-widget-prod/container/v1/metaframe.js";

metaframeScript.onload = () => {

 window.metaframe.create(

   {
     loginProjectId: '00000000-0000-0000-0000-000000000000',
     merchantId: 000001,
     projectId: 000001,
     orbsApiHostId: '00000000-0000-0000-0000-000000000000',
     isMobile: false,
   }

 );

};

document.body.appendChild(metaframeScript);
이 기사가 도움이 되었나요?
감사합니다!
개선해야 할 점이 있을까요? 메시지
유감입니다
이 기사가 도움이 안 된 이유를 설명해 주세요. 메시지
의견을 보내 주셔서 감사드립니다!
메시지를 검토한 후 사용자 경험 향상에 사용하겠습니다.
마지막 업데이트: 2024년 10월 23일

오자 또는 기타 텍스트 오류를 찾으셨나요? 텍스트를 선택하고 컨트롤+엔터를 누르세요.

문제 보고
콘텐츠를 항상 검토합니다. 여러분의 피드백은 콘텐츠를 개선에 도움이 됩니다.
후속 조치를 위해 이메일을 제공해 주세요
의견을 보내 주셔서 감사드립니다!