Web SDK SKILL
AI로 원스토어 출시하기에서 소개한 두 번째 스킬이에요. 여기서는 실제 사용법만 다뤄요.
Web SDK SKILL은 HTML5 웹게임에 원스토어 H5 Game SDK를 연동하는 작업을 AI 코딩 에이전트가 대신 해주는 도구예요. 설치만 하면, 평소 쓰던 AI 도구에게 말로 시키는 것만으로 SDK 로드부터 결제·광고 연동, 릴리즈 전 점검까지 끝나요.
onestore-web-sdk
HTML5 웹게임에 원스토어 SDK를 붙이고, 인앱결제·인앱광고를 연동하고, 출시 전에 점검할 때
설치
준비하기
게임 진입 HTML이 있는 HTML5 웹게임 프로젝트가 있으면 돼요 — 바이브 코딩으로 만든 게임도 괜찮아요. 기본 설치는 npx를 써서 Node.js 22 이상이 필요해요. Node.js를 쓸 수 없다면 bash 설치 스크립트를 쓰면 돼요. macOS·Linux는 바로, Windows는 WSL이나 Git Bash가 있어야 해요.
설치하기
저장소: github.com/ONE-store/onestore_web_sdk_skills
아래를 복사해서 에이전트에 붙여넣어요.
[내 게임 프로젝트 경로]에서 npx skills add ONE-store/onestore_web_sdk_skills 를 실행해서
원스토어 Web SDK SKILL을 설치해줘.
끝나면 결과를 한 줄로 알려줘.cd <내 게임 프로젝트 경로>
npx skills add ONE-store/onestore_web_sdk_skills프로젝트에서 쓰는 에이전트를 찾아서 설치해요. 특정 에이전트에만 설치하려면 -a claude-code처럼 지정해요.
git clone https://github.com/ONE-store/onestore_web_sdk_skills.git
cd onestore_web_sdk_skills
./install.sh <내 게임 프로젝트 경로>설치 확인하기
"지금 원스토어 웹게임 SDK 연동 상태 확인해줘"라고 물어보세요. 진단 표가 나오면 설치가 끝난 거예요.
어디서 쓸 수 있나요
Claude Code
Cursor
GitHub Copilot (VS Code)
Gemini CLI
OpenAI Codex
Grok Build
무엇을 할 수 있나요
상태 진단
🟢 읽기 전용
어디서부터 손대야 할지 몰라 가이드 전체를 훑어봄
프로젝트를 읽어 표와 다음 할 일로 바로 알려줌 (판정마다 파일 위치 포함)
SDK 연동
🟡 파일 수정
SDK 로드 위치 · 스크립트 실행 순서 · 초기화 흐름을 손으로 맞춤
초기화 → 로딩 → 시작 흐름과 일시정지 · 재개 · 종료 처리를 같은 순서로 대신 넣어줌
인앱결제
🟡 파일 수정
결제 성공 응답만 보고 아이템을 지급해 나중에 사고로 발견
결제 · 상품 조회 코드를 넣고, 서버에서 구매를 검증할 연결 지점까지 만들어 줌
인앱광고
🟡 파일 수정
광고를 끝까지 봤는지 헷갈린 채로 보상을 지급
리워드 · 전면 광고 코드를 넣고, 보상은 서버에서 확정하도록 분기를 짜줌
임베드 요건 점검
🟢 읽기 전용
앱에서만 화면이 안 뜨는데 원인을 모름
원스토어 앱 안(iframe)에서 게임이 뜨기 위한 서버 · 코드 요건을 짚어줌
오류 진단
🟢 읽기 전용
오류 값을 검색하고 가이드와 대조하며 짐작
원인 · 재현 조건 · 수정 코드 · 확인 방법까지 짚어서 설명
릴리즈 전 점검
🟢 읽기 전용
체크리스트를 처음부터 끝까지 손으로 확인
블로커만 앞에 모으고, 통과한 항목은 개수로 접어서 보여줌
직접 써보세요 · 자연어 프롬프트
아래 문장을 그대로 복사해서 에이전트에 붙여넣어 보세요.
원스토어 웹게임 스킬로 뭐 할 수 있어?
지금 이 스킬로 할 수 있는 일을 전부 정리해서 보여주고, 바로 연동 상태까지 확인해줘요
이제 뭐 해야 해?
지금 상태를 다시 확인하고, 다음에 뭘 요청하면 되는지까지 짚어줘요
지금 원스토어 웹게임 SDK 연동 상태 확인해줘
지금까지 뭐가 됐고 뭐가 남았는지 표로 정리하고, 다음 할 일까지 알려줘요
원스토어 SDK 붙여줘
SDK 로드부터 초기화 · 로딩 · 시작 흐름, 일시정지 · 재개 · 종료 처리까지 순서대로 진행해줘요
원스토어 결제 붙여줘
결제 · 상품 조회 코드를 넣고, 서버에서 구매를 검증할 연결 지점을 만들어줘요
리워드 광고 붙여줘
광고를 끝까지 본 경우에만 보상을 보여주고, 실제 지급은 서버에서 확정하도록 짜줘요
앱에서만 화면이 하얗게 나와
대부분 코드가 아니라 서버 설정 문제예요. 게임 URL의 응답 헤더(iframe 허용 여부)부터 순서대로 좁혀가며 원인을 찾아줘요
이 오류 왜 나는지 확인해줘 (오류 로그 붙여넣기)
예를 들어 결제에서 already_owned가 뜨면 "소비 처리가 안 된 상품을 다시 산 것"이라는 뜻이에요. 원인과 함께, 소비 처리는 게임사 서버에서 해야 한다는 것까지 알려줘요
릴리즈 전에 점검해줘
출시를 막을 만한 문제만 골라서 보여주고, 나머지는 통과했다고 알려줘요
명령어로 바로 부르기
작업을 바로 지정하고 싶다면 스킬 이름 뒤에 명령어를 붙여요. Claude Code에서는 /onestore-web-sdk doctor처럼 입력하고, 다른 도구에서는 그 도구의 스킬 호출 방식을 쓰거나 위 프롬프트처럼 말로 요청하면 돼요.
doctor
현재 연동 상태 확인 (파일은 수정하지 않음)
integrate
SDK 로드, 부팅 흐름, 생명주기 처리
iap
인앱결제와 상품 정보 조회
ads
리워드 · 전면 광고
embed
iframe 임베드 요건 점검
fix <오류 또는 증상>
오류 원인과 수정 방법
check
릴리즈 전 점검 (파일은 수정하지 않음)
FAQ
Last updated