使用 Battle.net 设置 PlayFab 身份验证

本教程指导你完成使用 Battle.net 和 HTML5/JavaScript 设置 PlayFab 身份验证的过程。

要求

你需要：

一个用于测试的 Battle.net 账户。
已注册的 PlayFab title。
熟悉登录基础和最佳实践。
具有有效域名以充当静态 HTML 文件的服务器。请参阅为测试运行 HTTP 服务器教程，了解如何设置。

服务器和域名

本指南需要具有有效域名的服务器来跟进。如果你还没有注册域名和远程 Web 服务器，请按照我们的为测试运行 HTTP 服务器教程，了解如何设置一个具有有效域名的本地 Web 服务器。在本指南中，我们假设你的域名是 http://playfab.example。

检索 Battle.net title Client ID

首先导航到 Battle.net 并创建 Battle.net 开发者账户。创建账户后，你需要创建 title 并被分配 Client ID。

安装 Battle.net 附加组件

转到你 title 的 PlayFab Game Manager 页面。

在菜单中导航到 Add-ons。
找到并打开 Battle.net Add-on 图标/链接。

选择 Install Battle.net。

填写 Client ID for Game Client。
（可选）填写 Client ID for Game Server。
然后选择 Save settings 按钮。

PlayFab Game Manager Battle.net Add-on Client IDs

Battle.net 在 Add-on 页面上显示为活动。

PlayFab Game Manager Battle.net Add-on active

使用访问令牌进行测试

在此示例中，我们展示如何使用经典访问令牌方法测试 LoginWithBattleNet API。使用提供的 HTML 代码进行测试。

请务必用你自己的值替换 YOUR_CLIENT_ID、YOUR_PLAYFAB_TITLE_ID、YOUR_BNET_TITLE_NAME 和 YOUR_CLIENT_SECRET。

<!DOCTYPE html>
<html>
<head>
    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
</head>
<body>
    <h2>Battle.net SSO Token Demo (Manual Flow)</h2>
    <ol>
        <li>
            <button onclick="openBattleNetLogin()">Log in to Battle.net</button>
        </li>
        <li>
            After login, copy the <b>ST</b> value from the URL (e.g. <code>ST=US-xxxx-xxxx) and paste it here:
            

            <input type="text" id="ssoToken" size="80" placeholder="Paste SSO token (ST=...)" />
        </li>
        <li>
            Click "Exchange SSO Token for id_token"

            <button onclick="exchangeSSOToken()">Exchange SSO Token for id_token</button>
            

            <label>id_token:</label>

            <input type="text" id="idToken" size="80" placeholder="id_token will appear here" />
        </li>
        <li>
            Click "Login to PlayFab" to complete the flow

            <button onclick="loginWithPlayFab()">Login to PlayFab</button>
        </li>
    </ol>
    

    <div id="log"></div>
    <script>
        // Demo configuration variables
        const BNET_TITLE_NAME = 'YOUR_BNET_TITLE_NAME';
        const PLAYFAB_TITLE_ID = 'YOUR_PLAYFAB_TITLE_ID';
        const CLIENT_ID = 'YOUR_CLIENT_ID';
        const CLIENT_SECRET = 'YOUR_CLIENT_SECRET';

        function openBattleNetLogin() {
            const url = `http://account.battle.net/login/en/?app=${encodeURIComponent(BNET_TITLE_NAME)}`;
            window.open(url, '_blank');
        }

        function exchangeSSOToken() {
            const ssoToken = document.getElementById('ssoToken').value.trim();
            if (!ssoToken) {
                logLine("Please enter the SSO token.");
                return;
            }
            logLine("Exchanging SSO token for id_token...");
            // Prepare the request for the token exchange
            const params = new URLSearchParams();
            params.append('scope', 'account.basic openid');
            params.append('grant_type', 'urn:ietf:params:oauth:grant-type:token-exchange');
            params.append('subject_token', ssoToken);
            params.append('subject_token_type', 'urn:blizzard:params:oauth:token-type:sso');
            params.append('requested_token_type', 'urn:ietf:params:oauth:token-type:jwt');

            // Basic Auth header
            const authHeader = 'Basic ' + btoa(CLIENT_ID + ':' + CLIENT_SECRET);

            fetch('https://oauth.battle.net/token', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded',
                    'Authorization': authHeader
                },
                body: params
            })
            .then(res => res.json())
            .then(data => {
                if (data.id_token) {
                    document.getElementById('idToken').value = data.id_token;
                    logLine("id_token received.");
                } else {
                    logLine("Error: " + JSON.stringify(data));
                }
            })
            .catch(err => logLine("Error: " + err));
        }

        function loginWithPlayFab() {
            const idToken = document.getElementById('idToken').value.trim();
            if (!idToken) {
                logLine("Please exchange for an id_token first.");
                return;
            }
            logLine("Logging in to PlayFab...");
            axios.post(
                `https://${PLAYFAB_TITLE_ID}.playfabapi.com/Client/LoginWithBattleNet`,
                {
                    TitleId: PLAYFAB_TITLE_ID,
                    IdentityToken: idToken,
                    CreateAccount: true
                },
                {
                    headers: {
                        'Content-Type': 'application/json'
                    }
                }
            )
            .then(response => logLine("Response: " + JSON.stringify(response.data)))
            .catch(error => logLine("Error: " + JSON.stringify(error.response ? error.response.data : error)));
        }

        function logLine(message) {
            const logDiv = document.getElementById('log');
            logDiv.innerHTML += message + "
";
        }
    </script>
</body>
</html></code>

记住使用你的 Web 服务器打开 HTML 页面，并确保使用你指定的 URL 访问此页面。

页面打开后，选择 Log in to Battle.net。
登录后，从 URL 复制 ST 值（例如：ST=US-xxxx-xxxx）并将其输入到对话框中。
选择 Exchange SSO Token for id_token 并将该值复制到对话框中。
选择 Login to PlayFab 以完成登录流程。
完成后，脚本尝试在 PlayFab 端进行身份验证并显示结果。

XBOX Services

PlayFab

为 PlayFab 设置 Sign In with Battle.net

使用 Battle.net 设置 PlayFab 身份验证

要求

服务器和域名

检索 Battle.net title Client ID

安装 Battle.net 附加组件

使用访问令牌进行测试

​使用 Battle.net 设置 PlayFab 身份验证

​要求

​服务器和域名

​检索 Battle.net title Client ID

​安装 Battle.net 附加组件

​使用访问令牌进行测试

使用 Battle.net 设置 PlayFab 身份验证

要求

服务器和域名

检索 Battle.net title Client ID

安装 Battle.net 附加组件

使用访问令牌进行测试