Finding You And Friend's Common Games In Steam
<< Home

Finding You And Friend's Common Games In Steam

(Featured image by Aleks Dorohovich on Unsplash.)

Sometimes, the games are many, and the time is little. How can you quickly find the common games between you and your friend? Well, I am going to implement it here, and then tell you how to implement (It’s pretty easy)! Also, I definitely won’t track you (this site has analytics though. Please keep it on because I only have ~2 visitors every day!).

Try It Out

First, you need to get your Web Steam API Key here: https://steamcommunity.com/dev/registerkey. Then, you need to go to your own and your friend’s Steam profile page, which could be checked out in your username → View my profile. Copy the part after slash id until you meet another slash. In my case, 42yeah. You might have a 17-digit long number instead, and that’s OK!

Yep, I have no money

If there’s no URL there, you might want to display it:

Slightly large gif

And now, fill out this form:

Key:

Player A’s Id:

Player B’s Id:

Submit

Click “Submit” to see common games here.

Implementation

Well, isn’t that cool? Let’s implement it again! This could also be considered as a really, really tiny tutorial to Steam APIs.

Get an API Key

I think we’ve covered that above, but in case you didn’t try, go to https://steamcommunity.com/dev/apikey to get your Steam Web API key. Now you can call all sorts of functions with this blessed key!

Get the SteamID

Now, the steam ID might be the one in your community URL, but also not really at the same time. People like me defined a custom URL for the Steam community, and thus will have a different URL. If we need to get the SteamID for people like me, you need to visit

http://api.steampowered.com/ISteamUser/ResolveVanityURL/v0001?key=<API key>&vanityurl=<42yeah>

and it will resolve the steam ID for you:

function resolve(value) {
    // Is it not a custom url?
    if (value.length == 17 && +value != NaN) {
        resolves[index] = value;
        return value;
    }
    // If it's not, visit the API
    fetch("http://api.steampowered.com/ISteamUser/ResolveVanityURL/v0001?key=" + key + "&vanityurl=" + value)
        .then(res => {
            return res.json();
        })
        .then(json => {
            if (json.response.success == 1) {
                return json.response.steamid;
            }
        });
}

Oh yeah. By the way, Steam APIs does not have their CORs policy enabled, so you need to build a small app for this.

Get the Games

You can visit the player’s games at here:

http://api.steampowered.com/IPlayerService/GetOwnedGames/v0001/?key=<API key>&steamid=<steam id>&format=json

Which, in JavaScript, looks a little bit like this:

function listGames() {
    for (let i = 0; i < resolves.length; i++) {
        fetch("http://api.steampowered.com/IPlayerService/GetOwnedGames/v0001/?key=" + key + "&steamid=" + resolves[i] + "&format=json")
            .then(res => {
                return res.json();
            })
            .then(json => {
                return json.response.games;
            });
    }        
}

And you will be welcomed by a list of games:

Games

Compare the Lists

Well, the next step is compare. That’s pretty easy, and I won’t explain. But here are the code, anyway:

function compareGames() {
    let same = games[0];
    for (let i = 0; i < same.length; i++) {
        const game = same[i];
        let exists = false;
        for (let j = 0; j < games[1].length; j++) {
            if (games[1][j].appid == game.appid) {
                exists = true;
                break;
            }
        }

        if (!exists) {
            same.splice(i, 1);
            i--;
            continue;
        }
    }
    return same;
}

After which, you should have one array with a list of appids. Done! Or is it? We still don’t get the names of the games!

Getting Names of the Games

OK. We get list, now we need names. But I really didn’t find an easy API for that. It might be my very unthorough (is that a word?) search on the Internet though; so if you know, please let me know! Anyway, here’s how we are going to get the names of the games:

There is another API available, and that’s getting EVERY SINGLE GAME on Steam. You can visit it here:

https://api.steampowered.com/ISteamApps/GetAppList/v2

No extra parameters needed! But man, this thing is huge:

Huge

And that’s why it’s impossible (or VERY irrational) to get it every single time! I cache it at the start of the program, and update it every 6000000 milliseconds (that’s 1.666… hours). But it’s up to you, really!

function cacheMasiveList() {
    fetch("https://api.steampowered.com/ISteamApps/GetAppList/v2")
        .then(res => {
            console.log("Massive list got. Translating to JSON...");
            return res.json();
        })
        .then(json => {
            massiveList = json.applist.apps;
            console.log("Cached massive list, length: " + massiveList.length);
        });

    setTimeout(cacheMasiveList, 6000000);
}

Done!

And now, you can get the name of the games by simply comparing to that huge list:

function getName(appid) {
    for (let i = 0; i < massiveList.length; i++) {
        if (massiveList[i].appid == appid) {
            return massiveList[i].name;
        }
    }
    return "Unknown";
}

Conclusion

Well, Steam has a really clean API and not a lot of query parameters are needed. Which is good, because I really am bad at these kind of stuffs. It’s been a fun ride! Also, I should mention that this code cannot get through private profiles, and it will fail silently. Well, it that happens, I guess there’s nothing I can do! And that concludes it! Adieu!

I also provide the source tree of my project. You can download only this part, and

npm install
node main.js

to try it out. It runs on local port 41234!

References

  1. Get Steam Web API Key, Steam
  2. Getting Started, Steamworks
  3. WebAPI Overview, Steamworks
  4. ISteamApps Interface, Steamworks
  5. IPlayerService, Steamworks
  6. Docs | Node.js
  7. Steam ID Finder
  8. Source tree of this project