[멋쟁이사자처럼 부트캠프 TIL] 유니티 게임 개발 3기 : 리더보드 구현

 

 

오늘은 오전에 TicTacToe 리더보드 구현을 자습으로 진행했다.

 

먼저 서버에 전체 유저 점수를 조회해서 보내주기 위한 get 메서드를 추가했다.

// 전체 유저 점수 조회
router.get('/scorelist', async function(req, res, next) {
  try {
    if (!req.session.isAuthenticated) {
      return res.status(403).send("로그인이 필요합니다");
    }

    var database = req.app.get('database');
        var users = database.collection('users');

    const userList = await users.find().sort({score: -1}).toArray();
    if (userList.length === 0) {
      return res.status(404).send("사용자가 존재하지 않습니다");
    }

    const filteredUserList = userList.map(user => ({
      id: user._id,            // _id를 id로 변경
      username: user.username, 
      nickname: user.nickname, 
      score: user.score
    }));

    res.json(filteredUserList);

  } catch (err) {
    console.error("점수 조회 중 오류 발생:", err);
    res.status(500).send("서버 오류가 발생했습니다");
  }
});

 

 

서버랑 통신하는 NetworkManager.cs에 아래처럼 점수 추가, 전체 유저 점수 조회 메서드를 추가했다.

해당 유저 점수 조회는 GameManager에서 맨 처음 실행되고 있는데 이때 가져온 userId를 PlayerPrefs에 할당해서 해당 userId를 활용해 리더보드에서 현재 유저의 점수를 최상단에 표시하도록 구현했다.

    public void GetScore(Action<ScoreResult> success, Action failure)
    {
        StartCoroutine(GetScoreCoroutine(success, failure));
    }

    public IEnumerator GetScoreCoroutine(Action<ScoreResult> success, Action failure)
    {
        using (UnityWebRequest www =
               new UnityWebRequest(Constants.ServerURL + "/users/score", UnityWebRequest.kHttpVerbGET))
        {
            www.downloadHandler = new DownloadHandlerBuffer();
            
            string sid = PlayerPrefs.GetString("sid", "");
            if (!string.IsNullOrEmpty(sid))
            {
                www.SetRequestHeader("Cookie", sid);
            }
            
            yield return www.SendWebRequest();

            if (www.result == UnityWebRequest.Result.ConnectionError ||
                www.result == UnityWebRequest.Result.ProtocolError)
            {
                Debug.Log("Error: " + www.error);
                if (www.responseCode == 403)
                {
                    GameManager.Instance.OpenConfirmPanel("로그인이 필요합니다", () =>
                    {
                        // 로그인 화면
                        GameManager.Instance.OpenSigninPanel();
                    });                }
                
                failure?.Invoke();
            }
            else
            {
                var result = www.downloadHandler.text;
                var userScore = JsonUtility.FromJson<ScoreResult>(result); // ScoreResult로 result를 변환
                Debug.Log("result" + result);
                PlayerPrefs.SetString("user_id", userScore.id);  // 서버에서 로그인 시 ID 저장 필요
                Debug.Log(userScore.id);
                
                success?.Invoke(userScore);
            }
        }
    }
    

	public void AddScore(Action success, Action failure)
    {
        StartCoroutine(AddScoreCoroutine(success, failure));
    }

    public IEnumerator AddScoreCoroutine(Action success, Action failure)
    {
        var scoreRequest = new ScoreRequest(ScoreData.score);
        string jsonString = JsonUtility.ToJson(scoreRequest);
        byte[] bodyRaw = System.Text.Encoding.UTF8.GetBytes(jsonString);
        
        using (UnityWebRequest www =
               new UnityWebRequest(Constants.ServerURL + "/users/addscore", UnityWebRequest.kHttpVerbPOST))
        {
            www.uploadHandler = new UploadHandlerRaw(bodyRaw);
            www.downloadHandler = new DownloadHandlerBuffer();
            www.SetRequestHeader("Content-Type", "application/json");
                
            // 세션 ID 가져와서 요청에 포함
            string sid = PlayerPrefs.GetString("sid", "");
            if (string.IsNullOrEmpty(sid))
            {
                Debug.Log("세션 정보가 없습니다. 로그인이 필요합니다.");
                GameManager.Instance.OpenSigninPanel();
                yield break;  // 요청 중단
            }
            www.SetRequestHeader("Cookie", sid);

            yield return www.SendWebRequest();
    
            if (www.result == UnityWebRequest.Result.ConnectionError ||
                www.result == UnityWebRequest.Result.ProtocolError)
            {
                if (www.responseCode == 403)
                {
                    GameManager.Instance.OpenConfirmPanel("로그인이 필요합니다", () =>
                    {
                        // 로그인 화면
                        GameManager.Instance.OpenSigninPanel();
                    });                }
                
                failure?.Invoke();
            }
            else
            {
                var result = www.downloadHandler.text;
                Debug.Log("Result: " + result);
                
                success?.Invoke();
            }
        }
    }
    
    public void GetScoreList(Action<string> success, Action failure)
    {
        StartCoroutine(GetScoreListCoroutine(success, failure));
    }

    public IEnumerator GetScoreListCoroutine(Action<string> success, Action failure)
    {
        using (UnityWebRequest www =
               new UnityWebRequest(Constants.ServerURL + "/users/scorelist", UnityWebRequest.kHttpVerbGET))
        {
            www.downloadHandler = new DownloadHandlerBuffer();
            
            string sid = PlayerPrefs.GetString("sid", "");
            if (!string.IsNullOrEmpty(sid))
            {
                www.SetRequestHeader("Cookie", sid);
            }
            
            yield return www.SendWebRequest();

            if (www.result == UnityWebRequest.Result.ConnectionError ||
                www.result == UnityWebRequest.Result.ProtocolError)
            {
                Debug.Log("Error: " + www.error);
                if (www.responseCode == 403)
                {
                    GameManager.Instance.OpenConfirmPanel("로그인이 필요합니다", () =>
                    {
                        // 로그인 화면
                        GameManager.Instance.OpenSigninPanel();
                    });                }
                
                failure?.Invoke();
            }
            else
            {
                var result = www.downloadHandler.text;
                
                Debug.Log(result);
                
                success?.Invoke(result);
            }
        }
    }

 

각 리더보드 아이템에 추가할 코드는 아래처럼 추가했다.

LeaderboardItem.cs

using TMPro;
using UnityEngine;

public class LeaderboardItem : MonoBehaviour
{
    public TextMeshProUGUI nicknameText;
    public TextMeshProUGUI scoreText;

    public void SetLeaderboardItems(string nickname, int score)
    {
        nicknameText.text = nickname;
        scoreText.text = score.ToString();
    }
}

 

리더보드 패널에 들어갈 스크립트는 아래처럼 작성했다. struct 사용이 아직 어색하게 느껴진다. 쓰다보면 나아지겠지...

LeaderboardPanel.cs

using System.Collections.Generic;
using System.Linq;
using Newtonsoft.Json;
using TMPro;
using UnityEngine;

public struct ScoreResult
{
    public string id;
    public string username;
    public string nickname;
    public int score;
}

public static class ScoreData
{
    public static int score = 0; // 기본 점수는 0

    // 점수를 추가하는 메서드
    public static void AddScore(int amount)
    {
        score += amount;
    }

    public static void SetScore(int amount)
    {
        score = amount;
    }

}

public class ScoreRequest
{
    public int score; // 서버에 보낼 점수 데이터

    public ScoreRequest(int score)
    {
        this.score = score;
    }
}



public class LeaderboardPanel : MonoBehaviour
{
    [SerializeField] public Transform content;
    [SerializeField] public GameObject LeaderboardItemPrefab;

    private void Start()
    {
        LoadLeaderboard();
    }

    public void LoadLeaderboard()
    {
        NetworkManager.Instance.GetScoreList(OnSuccess, OnFailure);
    }

    private void OnSuccess(string jsonData)
    {
        // 서버에서 받은 JSON을 리스트로 변환
        List<ScoreResult> scores = JsonConvert.DeserializeObject< List<ScoreResult>>(jsonData);
        string currentUserId = PlayerPrefs.GetString("user_id", "");
        
        
        // 현재 유저의 데이터 찾기
        ScoreResult? currentUserData = scores.FirstOrDefault(s => s.id == currentUserId);

        // 현재 유저를 제외한 다른 유저 리스트
        List<ScoreResult> otherUsers = scores.Where(s => s.id != currentUserId).ToList();
        otherUsers = otherUsers.OrderByDescending(s => s.score).ToList();
        
        // 기존 목록 삭제
        foreach (Transform child in content)
        {
            Destroy(child.gameObject);
        }
        
        /// 현재 유저 데이터를 먼저 추가 (있을 경우)
        if (currentUserData.HasValue)
        {
            GameObject leaderboardItem = Instantiate(LeaderboardItemPrefab, content);
            LeaderboardItem item = leaderboardItem.GetComponent<LeaderboardItem>();
            item.SetLeaderboardItems(currentUserData.Value.nickname, currentUserData.Value.score);

            // 현재 유저 강조 표시
            item.nicknameText.GetComponent<TMP_Text>().color = new Color(255f, 200f, 0f, 255f);
            item.scoreText.GetComponent<TMP_Text>().color = new Color(255f, 200f, 0f, 255f);
        }

        // 나머지 유저 데이터 추가
        foreach (var scoredata in otherUsers)
        {
            GameObject leaderboardItem = Instantiate(LeaderboardItemPrefab, content);
            LeaderboardItem item = leaderboardItem.GetComponent<LeaderboardItem>();
            item.SetLeaderboardItems(scoredata.nickname, scoredata.score);
        }
    }

    private void OnFailure()
    {
        Debug.Log("리더보드 데이터를 불러오지 못했습니다.");
    }
}

 

점수 추가는 GameManager.cs에서 기존에 있던 코드에 추가했다.

    /// <summary>
    /// 게임 오버시 호출되는 함수
    /// gameResult에 따라 결과 출력
    /// </summary>
    /// <param name="gameResult">win, lose, draw</param>
    private void EndGame(GameResult gameResult)
    {
        // 게임오버 표시
        _gameUIController.SetGameUIMode(GameUIController.GameUIMode.GameOver);
        _blockController.OnBlockClickedDelegate = null;
        
        // TODO: 나중에 구현!!
        switch (gameResult)
        {
            case GameResult.Win:
                ScoreData.AddScore(10);
                NetworkManager.Instance.AddScore(() => { Debug.Log("점수 업데이트 성공!"); }, 
                    () => { Debug.Log("점수 업데이트 실패!"); });
                Debug.Log("Player A win");
                
                break;
            case GameResult.Lose:
                Debug.Log("Player B win");
                break;
            case GameResult.Draw:
                Debug.Log("Draw");
                break;
        }
    }

 

리더보드 패널 여는 메서드도 아래처럼 GameManager.cs에 추가했다.

    public void OpenLeaderboardPanel()
    {
        if (_canvas != null)
        {
            var leaderboardPanelObject = Instantiate(leaderboardPanel, _canvas.transform);
        }
    }

 

마지막으로 해당 버튼을 누르면 리더보드 패널이 열리도록 구현했다.

    public void OnClickScoreButton()
    {
        GameManager.Instance.OpenLeaderboardPanel();
        // NetworkManager.Instance.GetScoreList((scoreList) =>
        // {
        //     
        // }, () => { });
    }

 

 

---

 

후다닥 짜다보니 헷갈려서 중간에 삽질을 많이했고 코드도 발전가능성이 많아 보이지만 일단은 나름 원하던 결과물은 나온 것 같다.

 

특히 서버에서 처음에 그냥 userList를 넘겼더니 _id로 id값이 넘어와서 클라이언트에서 처리할 때 제대로 된 값을 할당해주지 못하는 이슈가 있었다.

처음에는 클라이언트에서 현재 유저 찾을 때 _id로 찾을 수 있도록 수정했으나 이미 기존 서버에서 현재 유저의 점수만 가져올 때 id로 바꿔서 가져오고 있었기 때문에, 이러면 currentUserId가 null이 되면서(id로 찾아야하는데 _id로 찾아서 값이 null) 통일이 되지 않았다.

그래서 서버에서 통일하는 게 맞다는 생각이 들어 map을 써서 수정했다. 오랜만에 백엔드 잡으니 재밌었다.