로컬 서버에서 실행

게임 개발과 테스트를 편리하게 하기 위해 로컬 서버에서 게임을 실행할 수 있습니다. 테스트는 prod- 및 dev-환경에서 모두 가능합니다.

로컬 서버에서 게임을 실행하면 SDK의 모든 기능을 사용할 수 있습니다.

Prod-환경

제한

Yandex Games 플랫폼에 계정 등록 및 게임 초안 생성이 필요합니다.

게임을 모더레이션 제출 전 최종 점검 단계에 적합합니다. 이 모드에서 게임은 실제 Yandex Games 플랫폼과 상호작용합니다.

특징:

게임은 실제 주소인 yandex.com/games에서 열립니다.
외부 호스트로 요청을 보내려면 CSP 규칙에 추가해야 합니다.
실제 광고가 표시됩니다.
플레이어는 Yandex 계정으로 인증됩니다.
플레이어 데이터와 리더보드 정보는 서버에 저장됩니다.
상품 카탈로그는 서버에서 로드되며, 구매는 서버에서 처리됩니다.
디버깅을 위해 주소 표시줄 매개변수 &debug-mode=16 을 사용해 디버그 패널을 활용할 수 있습니다.

로컬 버전의 게임을 prod-환경에서 실행하도록 설정하는 방법:

로컬 서버 직접 설정

localhost 서버를 설정하세요.
초안 모드에서 게임을 엽니다.
주소에 ?game_url=https://localhost 매개변수를 추가하세요.

참고

보안상의 이유로 game_url 매개변수에는 localhost 도메인만 지원됩니다.

npm 패키지로 로컬 서버 설정

Node.JS 사이트의 안내에 따라 npm을 설치하세요.
npm 을 사용해 @yandex-games/sdk-dev-proxy 패키지를 설치하세요:
```
npm install -g @yandex-games/sdk-dev-proxy
```
게임을 실행하세요. 다음 중 선택할 수 있습니다:
로컬 서버로 프록시

게임 리소스 폴더 지정
```
npx @yandex-games/sdk-dev-proxy -h <로컬 서버 주소>
```
```
npx @yandex-games/sdk-dev-proxy -p <게임 리소스 폴더 경로>
```
패키지는 SDK 리소스에 대한 요청을 게임이 위치할 서버로 프록시합니다.

--app-id 매개변수를 지정하면 게임이 yandex.com/games에서 열립니다:

npx @yandex-games/sdk-dev-proxy -p <게임 리소스 폴더 경로> --app-id=<게임 ID>

--app-id 를 지정하지 않으면 콘솔에 서비스 상의 게임 템플릿 링크와 로컬 서버 링크가 표시됩니다.

실행 매개변수

매개변수	설명
`--help`	도움말.
`--host`, `-h`	게임 로컬 서버가 위치한 호스트 (예: `webpack-dev-server` 사용 시).
`--path`, `-p`	게임 리소스가 위치한 폴더 경로.
`--port`	서버가 열릴 포트 (기본값 8080).
`--app-id`, `-i`	게임 초안 ID.
`--csp`, `-c`	`Content-Security-Policy` 메타태그 추가. 서비스의 `index.html`에 생성될 태그와 동일합니다.
`--log`, `-l`	콘솔에 요청 로깅 활성화 (기본값 활성화).
`--tld`	`yandex.tld` 도메인 변경 (예: `yandex.com`, 기본값 `ru`).
`--dev-mode`	`true` 인 경우 dev-환경에서 게임 실행 (기본값 `false`, prod-환경에 해당).

Dev-환경

참고

Yandex Games 플랫폼 계정 등록 및 게임 초안이 필요 없습니다.

게임 로직 개발 및 디버깅 단계에 적합합니다. 이 모드에서는 게임이 Yandex Games 플랫폼과 실제 연결되지 않으며, 모든 SDK 호출이 모의 객체로 대체되어 페이지를 빠르게 새로 고치고 업데이트를 확인할 수 있습니다.

특징:

게임이 https://localhost 에서 직접 열립니다.
CSP 제한이 없어 모든 외부 호스트로 요청을 보낼 수 있습니다.
광고 대신 스터브가 표시되며, 모든 콜백 함수는 prod-환경과 동일하게 작동합니다.
플레이어 인증은 모의 브라우저 대화 상자를 통해 이루어집니다.
플레이어 데이터와 리더보드 정보는 localStorage 에 저장됩니다.
상품 카탈로그는 로컬 파일에서 로드되며, 플레이어 구매는 localStorage 에 저장됩니다.
디버깅을 위해 브라우저 주소 표시줄을 통해 매개변수를 설정할 수 있습니다.
브라우저 콘솔에는 모듈별로 분류된 모든 SDK 호출이 자동으로 기록됩니다.

dev-환경에서의 실행은 npm 패키지 @yandex-games/sdk-dev-proxy를 통해서도 가능합니다. 설정 방법은 prod-환경과 유사하지만, 실행 시 --dev-mode=true 매개변수를 지정해야 합니다.

다음 중 선택할 수 있습니다:

로컬 서버로 프록시

게임 리소스 폴더 지정

npx @yandex-games/sdk-dev-proxy -h <로컬 서버 주소> --dev-mode=true

npx @yandex-games/sdk-dev-proxy -p <게임 리소스 폴더 경로> --dev-mode=true

브라우저 주소 표시줄 매개변수

export interface SDKMocks {
    /** 바탕 화면에 바로가기 추가 가능한가? */
    canShowPrompt?: boolean;
    /** 플레이어가 인증되었는가? */
    isAuthorized?: boolean;
    /** 게임의 화면 방향이 고정되었는가. */
    lockedOrientation?: ELockedOrientation;
}

/** 모바일 화면에서 게임의 고정된 화면 방향. */
export enum ELockedOrientation {
    /** 게임이 가로 모드만 지원. */
    LANDSCAPE = 'landscape',
    /** 게임이 모든 방향 지원. */
    NONE = 'none',
    /** 게임이 세로 모드만 지원. */
    PORTRAIT = 'portrait',
}

예시

localhost:8080?mocks={"canShowPrompt":true,"isAuthorized":true,"lockedOrientation":"landscape"}

로컬 상품 카탈로그 설정

상품 카탈로그를 에뮬레이션하려면 프로젝트 루트에 purchases-catalog.json 파일을 생성하고 개발자 콘솔에 추가했거나 추가할 예정인 구매 목록을 입력하세요. SDK는 dev-모드에서 이 파일에서 구매 목록을 로드합니다.

예시

[
    {
        "description": "Well styled modern avatar image",
        "id": "avatar",
        "imageURI": "{path-to-image}",
        "price": "100 RUB",
        "priceCurrencyCode": "RUB",
        "priceValue": "100",
        "title": "Premium avatar",
        "getPriceCurrencyImage": "return ''"
    }
]

구매 호출 시 성공과 취소 시나리오를 모두 테스트할 수 있도록 모의 대화 상자가 표시됩니다.

Was the article helpful?

테스트

Debug 패널