결제 위젯 표시 설정
플랫폼에 결제 위젯 인터페이스를 추가하려면 위젯 라이브러리를 추가해야 합니다. 사용자 경험을 개선하기 위해 위젯 높이와 이벤트 처리해야 할 수도 있습니다.
결제 위젯 라이브러리 추가
알림
샌드박스 모드에서 결제 위젯을 열려면 다음 지침을 참조해 주세요.
스크립트를 사용해 설정하기
플랫폼 웹사이트 페이지에 스크립트를 추가합니다. 스크립트 초기화 매개변수에서 이전 통합 단계에서 받은 인증 토큰을 전달합니다. 페이지가 로드될 때마다 스크립트가 실행됩니다.Copy
<script>
var s = document.createElement('script');
s.type = "text/javascript";
s.async = true;
s.src = "https://static.xsolla.com/payouts/v0/_bundles/santorelli.min.js";
s.addEventListener('load', function () {
const widget = new XPayoutsWidget.Widget({
token: '<auth token>',
theme: 'black',
size: 'fixed'
});
widget.show('<container_id>');
widget.addEventListener('load', () => {
console.log('loaded');
});
}, false);
var head = document.getElementsByTagName('head')[0];
head.appendChild(s);
</script>
npm-package를 사용해 설정하기
npm install @xsolla/payouts-sdk
명령을 실행하고 위젯 라이브러리를 설정합니다.- 플랫폼 사이트에 라이브러리 링크를 추가합니다. 요청에서 이전 통합 단계에서 받은 인증 토큰을 전달합니다.
FAQ
일반 문제를 해결하려면 답변을 참조하세요.
Copy
import {Widget} from '@xsolla/payouts-sdk';
const widget = new Widget({
token: '<auth token>',
theme: 'black',
size: 'fixed'
});
widget.show('<container_id>');
widget.addEventListener('load', () => {
console.log('loaded');
});
추가 설정
높이
초기화 코드에 다음 파라미터를 전달해 결제 위젯의 높이를 조정할 수 있습니다:매개 변수 | 유형 | 설명 |
---|---|---|
| string | 결제 위젯 높이:
|
이벤트 처리
다음 이벤트 처리 방법을 설정할 수 있습니다.
loaded
- iframe으로 위젯 로딩.tokenExpired
- 토큰 만료.requestWithdrawal
- 성공적인 인출 요청 접수.heightResize
- 위젯 높이 변경.size==‘auto’
매개변수가 전달되는 경우에만 이벤트를 처리합니다.
이벤트 처리 설정 예시:
Copy
widget.addEventListener('tokenExpired', () => {
console.log('tokenExpired');
});
widget.addEventListener('heightResize', ({ height }) => {
console.log(`height resize to: ${height}`);
});
widget.addEventListener('requestWithdrawal', ({ amount }) => {
console.log(`success request withdrawal, amount: ${amount}`);
});
진행률
오자 또는 기타 텍스트 오류를 찾으셨나요? 텍스트를 선택하고 컨트롤+엔터를 누르세요.