最近 Steam 推出了一种新的游戏库家庭共享方案，简单来说支持六个用户组建成新的家庭，而这五个人可以游玩所有成员的游戏（即并集）。同时相比过去老的家庭共享功能，新的Steam家庭中玩家可以在其他玩家在线的同时游玩家庭库列表中的共享游戏，也支持离线访问，但是需要注意的是同一款游戏不能共同访问，除非这款游戏在家庭库中有多个副本。这一方案刚推出引起了很多玩家的热烈讨论，并有很多玩家在社区内寻找优质成员组建成新的家庭。

由于加入到家庭中再退出存在一年的冷却期（离开后席位也有一年的冷却期），所以为了避免玩家在加入家庭后失望不满，所以我想着利用 Steam Web API 开发出一个 Web 应用，方便各位玩家在加入前知晓自己加入后可以获得哪些新游戏的游玩权限而开发。

可行性#

利用 Steam Web API 可以查看用户的库存，因此在理论上是可行的。

通过 http://api.steampowered.com/ISteamWebAPIUtil/GetSupportedAPIList/v1/?key=xxx&steamids=xxx 接口可以获取该key可用的所有API信息，通过查询表明我的 key 可以使用一个名为 GetOwnedGames 的接口查询用户的库存信息。

{
    "name": "GetOwnedGames",
    "version": 1,
    "httpmethod": "GET",
    "description": "Return a list of games owned by the player",
    "parameters": [
        {
            "name": "key",
            "type": "string",
            "optional": false,
            "description": "Access key"
        },
        {
            "name": "steamid",
            "type": "uint64",
            "optional": false,
            "description": "The player we're asking about"
        },
        {
            "name": "include_appinfo",
            "type": "bool",
            "optional": false,
            "description": "true if we want additional details (name, icon) about each game"
        },
        {
            "name": "include_played_free_games",
            "type": "bool",
            "optional": false,
            "description": "Free games are excluded by default.  If this is set, free games the user has played will be returned."
        },
        {
            "name": "appids_filter",
            "type": "uint32",
            "optional": false,
            "description": "if set, restricts result set to the passed in apps"
        },
        {
            "name": "include_free_sub",
            "type": "bool",
            "optional": false,
            "description": "Some games are in the free sub, which are excluded by default."
        },
        {
            "name": "skip_unvetted_apps",
            "type": "bool",
            "optional": true,
            "description": "if set, skip unvetted store apps"
        },
        {
            "name": "language",
            "type": "string",
            "optional": false,
            "description": "Will return appinfo in this language"
        },
        {
            "name": "include_extended_appinfo",
            "type": "bool",
            "optional": false,
            "description": "true if we want even more details (capsule, sortas, and capabilities) about each game.  include_appinfo must also be true."
        }
    ]
}

技术选型#

服务端#

由于 Steam Web API 接口返回的数据格式对于我来说并不是很友好，因此我这里使用 Node.js 对接口预先进行处理封装，再将其提供给前端直接使用。

客户端#

使用 React + Ant Design 进行开发。

准备工作#

获取 Steam Web API 的 key。

访问 https://steamcommunity.com/dev/apikey 如果没有 key 则按照指示创建一个。

如下如所示。