🍿

스낵게임 Biz

소개
게임 결과 활용
커스터마이징
시작하기
Plans
Basic
Pro (준비중)
Documentation
게임 화면 임베딩
Web
React Native
게임 결과 수신
Web
React Native
게임 재시작
Web
React Native
게임 결과 검증
스낵게임 Biz 공개키
햅틱 피드백
Web
React Native
QnA
Q. 수신된 게임 결과를 믿어도 되나요?

소개

스낵게임 Biz는 스낵게임의 게임들을 코드 한 줄로 간편하게 임베딩할 수 있는 서비스입니다.

게임 결과 활용

게임 결과를 비즈니스에 알맞게 활용할 수 있습니다 🙂

이미 검증 시스템을 통과했으니까요!

커스터마이징

리소스 이미지, 색상, 게임결과 팝업 여부 …

커스터마이징이 가능한 백오피스를 제공합니다.

개발 리소스 없이 게임을 운영해보세요.

시작하기

비즈니스 임팩트에 더 집중해보세요!

게임 운영은 스낵게임이 할게요 💪🏻

Plans

💡

Basic

우선 시작해보세요.

스낵게임 임베딩은 무료입니다!

시작하기

💡

Pro (준비중)

커스터마이징이 필요하세요?

백오피스를 활용해보세요.

코드는 손 댈 필요도 없습니다.

시작하기

Documentation

게임 화면 임베딩

게임 화면을 임베딩합니다

Web

iframe 태그를 사용합니다

<iframe src="https://biz.snackga.me/snack-game"/>

React Native

react-native-webview를 사용합니다

<WebView source={{ uri: 'https://biz.snackga.me/snack-game' }} />

게임 결과 수신

게임 결과를 메시지로 수신합니다.

{
  "type": "snackgameresult",
  "payload": {
    "original": {
      "metadata": {
        "gameId": 4,
        "localizedName": "스낵게임 Biz"
      },
      "ownerId": 801,
      "sessionId": 70,
      "state": "EXPIRED",
      "score": 0,
      "createdAt": "2024-10-09T11:27:29.054329",
      "percentile": 64
    },
    "signed": "eyJraWQiOiItMTUzNzE1OTU2MyIsImFsZyI6IlJTMjU2In0.eyJtZXRhZGF0YSI6eyJnYW1lSWQiOjQsImxvY2FsaXplZE5hbWUiOiLsiqTrgrXqsozsnoQgQml6In0sIm93bmVySWQiOjgwMSwic2Vzc2lvbklkIjo3MCwic3RhdGUiOiJFWFBJUkVEIiwic2NvcmUiOjAsImNyZWF0ZWRBdCI6IjIwMjQtMTAtMDlUMTE6Mjc6MjkuMDU0MzI5IiwicGVyY2VudGlsZSI6NjR9.T46CtaO_9m5u_tugKYe_SXp1oLqHKqgd1DnoF0S9k-1FFEb4xY-Jg5pb_GunP5_WFoDgNmWtIwiXTamFZ9au96SmHPEs9XhfhRjPjnAsUNXeANlZR_mbq3iMOh_XgWtAT6z-Po0JP3uligIs34uMySBhhC4DcdudQlH7kWHhYYxVlqhHFVpyBLY1PfYUcos0_ka9OAArQdab7yKdW2w1DkCCp8t3rzGot5Hg5Clvvd3TEurXc3z4Yq_YI6DRkmyK8WnunJk4TLpqcSG_fedKO0Qh4uew703RpiBlbCjdR5oFn0Us2NZVLgzkF6V6KHbn1F6j1YCaQ11nVm09Rq2yEQ"
  }
}

게임 결과 스키마

Web

message 이벤트 리스너를 등록합니다.

const handleMessage = (event) => {
	if (!event.data.type?.startsWith("snackgame")) return;
  switch (event.data.type) {
	  case 'snackgameresult':
		  alert(`got score ${event.data.payload.original.score} from snackgame`);
      break;
	}
};
window.addEventListener("message", handleMessage);

React Native

WebView 컴포넌트에 onMessage 핸들러를 전달합니다.

<WebView
  ...
  onMessage={handleMessage}
/>

WebView 사용 예시

const handleMessage = (event: WebViewMessageEvent) => {
	const data = JSON.parse(event.nativeEvent.data);
  if (!data.type?.startsWith('snackgame')) return;
  switch (data.type) {
		case 'snackgameresult':
			console.warn(`got score ${data.payload.original.score} from snackgame`);
			break;
	}
};

게임 재시작

새 게임을 시작합니다.

* 로비 화면에서만 동작하는 기능입니다.

Web

iframe에 접근합니다

const iframe = document.querySelector("iframe");

Vanila JS

const iframeRef = useRef(null);
...
<iframe ref={iframeRef} />

React

메시지를 발송합니다

const handleRestart = () => {
  iframe.contentWindow.postMessage(
    { type: "snackgame-client-restart-invoked" }, "*"
  );
};

React Native

WebView에 접근합니다

const webViewRef = useRef(null);
...
<WebView ref={webViewRef} />

메시지를 발송합니다

const handleRestart = () => {
	const message = JSON.stringify({ type: "snackgame-client-restart-invoked" });
	webViewRef.current.postMessage(message);
};

게임 결과 검증

2024. 10. 9. 부터 서명된 게임 결과가 전송됩니다.

{
  "original": {
    "metadata": {
      "gameId": 4,
      "localizedName": "스낵게임 Biz"
    },
    "ownerId": 801,
    "sessionId": 70,
    "state": "EXPIRED",
    "score": 0,
    "createdAt": "2024-10-09T11:27:29.054329",
    "percentile": 64
  },
  "signed": "eyJraWQiOiItMTUzNzE1OTU2MyIsImFsZyI6IlJTMjU2In0.eyJtZXRhZGF0YSI6eyJnYW1lSWQiOjQsImxvY2FsaXplZE5hbWUiOiLsiqTrgrXqsozsnoQgQml6In0sIm93bmVySWQiOjgwMSwic2Vzc2lvbklkIjo3MCwic3RhdGUiOiJFWFBJUkVEIiwic2NvcmUiOjAsImNyZWF0ZWRBdCI6IjIwMjQtMTAtMDlUMTE6Mjc6MjkuMDU0MzI5IiwicGVyY2VudGlsZSI6NjR9.T46CtaO_9m5u_tugKYe_SXp1oLqHKqgd1DnoF0S9k-1FFEb4xY-Jg5pb_GunP5_WFoDgNmWtIwiXTamFZ9au96SmHPEs9XhfhRjPjnAsUNXeANlZR_mbq3iMOh_XgWtAT6z-Po0JP3uligIs34uMySBhhC4DcdudQlH7kWHhYYxVlqhHFVpyBLY1PfYUcos0_ka9OAArQdab7yKdW2w1DkCCp8t3rzGot5Hg5Clvvd3TEurXc3z4Yq_YI6DRkmyK8WnunJk4TLpqcSG_fedKO0Qh4uew703RpiBlbCjdR5oFn0Us2NZVLgzkF6V6KHbn1F6j1YCaQ11nVm09Rq2yEQ"
}

signed 필드에 서명된 게임 결과가 전달됩니다

스낵게임 Biz 공개키로 서명된 게임 결과를 검증할 수 있으며, 두 가지가 보장됩니다.

스낵게임 Biz에서 발송하였음
발송 이후 누구도 결과를 조작하지 않았음