[Facebook Instant Games] 리더보드 연동하는 방법

---

이 글은 PC 버전 TISTORY에 최적화 되어있습니다.

앱 페이지에서 Leaderboard 만들기

 일단 리더보드를 적용하려는 앱의 페이지로 가서 인스턴트 게임 - 리더보드로 들어가주면 다음과 같은 화면이 나옵니다. 리더보드를 특정 컨텍스트에 대해서만으로 제한하려면 컨텍스트 리더보드 옵션을 예로 설정한 후 이름을 지정하고 변경 사항을 저장합니다. (이름은 내부에서만 사용할 것이므로 이름에 대한 고민은 살짝 접어두고 global_leaderboad나 context_leaderboard 식의 이름으로 지정해줍니다.)

Cocos cretor에서 코드 작성

cc.Class({
    extends: cc.Component,

    properties: {
        score: 100
    },

    saveScoreToLeaderBoard: function () {
        var self = this;
        FBInstant.getLeaderboardAsync("global_leaderboard").then(function (leaderboard) {
            console.log("리더보드 가져옴.", leaderboard.getName());
            return leaderboard.setScoreAsync(self.score);
        }).then(function () {
            console.log("점수 저장", self.score);
        }).catch(function (reason) {
            console.log(reason)
        });
    },

    getScoreFromLeaderBoard: function () {
        FBInstant.getLeaderboardAsync("global_leaderboard").then(function (leaderboard) {
            return leaderboard.getEntriesAsync();
        }).then(function (entries) {
            console.log(entries);
            console.log("TOP SCORES")
            for (var i = 0; i < entries.length; i++) {
                console.log("#" + entries[i].getRank() + " " + entries[i].getPlayer().getName() + ": " + entries[i].getScore());
            }
        }).catch(function (reason) {
            console.error(reason)
        });
    }
});

위의 코드를 작성해주고 saveButton, getButton 두 버튼에 연결해줍니다. 위의 코드는 두가지 역할을 합니다. 관련 SDK는 포스트를 참고하세요.

• saveScoreToLeaderBoard: 해당 리더보드를 가져와서 리더보드에 점수를 저장합니다.
• getScoreFromLeaderBoard: 해당 리더보드의 점수 항목들을 가져와서 콘솔로 뿌려줍니다.

결과 확인

먼저 점수를 저장한 후에 (saveScoreToLeaderBoard) 리더보드의 점수 항목을 확인(getScoreFromLeaderBoard) 해본 결과입니다. 먼저 100점으로 저장을 완료하고, 해당 리더보드의 점수 항목을 for문으로 돌며 로그를 찍어보았습니다. 이 게임의 플레이어는 저 밖에 없으므로 한 개의 점수 항목만 나오는 것을 볼 수 있습니다. 

---