I am trying to implement a leaderboard in my Phaser 3 game. I am using a free leaderboard servive called Dreamlo (http://dreamlo.com/) for this. At the end of a game the player can enter their name and their score is uploaded to the leaderboard, this works. I can then open the leaderboard page in a new tab to view it without issue. The problem is I would much prefer to use the data to display the leaderboard in-game. I do this in my Unity games using a WWW request in a coroutine and saving the result of that request as a string to be broken up and displayed. Dreamlo allows you to add /pipe/ to the end of your URL to return a string with | separating score and name. In Phaser 3 (Javascript) if I add /pipe/ to the end of the URL it just displays the string in the webpage that opens in the new tab and there is no way for me to pull that data into the game.
If anyone knows a way to help with this please let me know. Thanks in advance.
For anyone else who might have this problem, you can import the leaderboard data using the json files.
Inside of the scene, declare:
“async getTopScores() {
const response = await fetch(‘[the public URL to the json file’);
const data = await response.json();
let scores = data.dreamlo.leaderboard.entry;
scores.sort((a, b) => b.score - a.score);
return scores.slice(0, n);
}”
where “n” is the number of scores you want displayed (e.g. n = 5 for a top 5 display).
then inside of create(), display the data you want where/when you want it:
let topScores = await this.getTopScores();
let y = 350;
for(let i = 0; i < topScores.length; i++) {
this.add.text(100, y, ${i + 1}. Score: ${topScores[i].score}, Name: ${topScores[i].name});
y += 20;
}"
