0

0

在网站上展示自定义Discord服务器数据:可行性与实现指南

霞舞

霞舞

发布时间:2025-11-05 22:04:01

|

728人浏览过

|

来源于php中文网

原创

在网站上展示自定义Discord服务器数据:可行性与实现指南

本教程旨在探讨如何在网站上集成和展示自定义discord服务器数据。我们将分析discord api在获取语音频道时长、消息发送量和特定角色在线成员方面的能力与限制,并提供针对性的实现方案,包括利用discord bot进行数据收集和通过http api获取成员列表的详细步骤,以帮助开发者构建功能丰富的discord相关网页应用。

理解Discord API的数据可访问性

在尝试将Discord数据集成到您的网站之前,首先需要理解Discord API所提供的数据类型及其访问方式。Discord API主要分为HTTP API(用于发送请求和获取静态数据)和Gateway(基于WebSocket,用于实时事件)。对于某些特定类型的统计数据,Discord的HTTP API并不直接提供现成的端点。

1. 语音频道时长统计

Discord的HTTP API没有直接的端点来查询用户在语音频道中花费的总时长。这意味着您无法通过简单的API调用获取“谁在语音频道中待的时间最长”这样的数据。

实现方案: 要获取这类数据,您需要开发一个Discord Bot

  • Bot开发: 该Bot需要连接到Discord Gateway,并监听与语音频道相关的事件(例如voiceStateUpdate)。
  • 数据记录: 当用户加入或离开语音频道时,Bot会记录相应的时间戳。
  • 数据存储与统计: Bot将这些时间数据存储在数据库中(例如MongoDB, PostgreSQL等),并定期对数据进行聚合和统计,以计算每个用户的总时长。
  • 自定义API: 为了在网站上展示这些数据,Bot需要提供一个自己的HTTP API端点。您的网站可以通过调用这个自定义API来获取统计结果。

这种方法虽然复杂,但能提供高度定制化的数据监控能力。

2. 消息发送量统计

与语音时长类似,Discord的HTTP API也没有直接的端点来统计每个用户发送的消息总量。虽然理论上可以通过遍历每个频道并获取所有历史消息来统计,但这种方法极不推荐:

  • API限速: 频繁地请求大量历史消息会迅速触及Discord API的速率限制,导致您的请求被暂时阻止。
  • 数据量巨大: 服务器中的消息数量可能非常庞大,传输和处理这些数据会消耗大量资源。
  • 效率低下: 这种方式效率极低,且不适合实时更新。

实现方案: 同样,Discord Bot是解决此问题的核心。

  • Bot开发: Bot连接到Discord Gateway,并监听messageCreate事件。
  • 数据记录: 每当有新消息发送时,Bot会捕获消息内容、发送者ID和时间戳。
  • 数据存储与统计: Bot将这些消息数据存储在数据库中,并根据用户ID进行计数统计。
  • 自定义API: Bot提供一个自定义HTTP API,供您的网站查询用户的消息发送量统计。

展示特定角色在线成员

这是通过Discord HTTP API相对直接可行的需求。您可以利用Discord的List Guild Members端点来获取服务器成员列表,并进行过滤。

1. 创建Discord应用程序并获取凭证

在使用Discord API之前,您需要在Discord开发者门户注册一个应用程序。

  • 访问开发者门户: 前往 Discord Developer Portal
  • 创建新应用: 点击“New Application”创建一个新应用。
  • 获取凭证: 在应用的“General Information”页面,您可以找到Client ID。如果需要使用Bot,在“Bot”页面添加一个Bot,并获取Token(请务必妥善保管此Token,不要泄露)。
  • 设置OAuth2: 如果您计划通过OAuth2流程让用户授权您的网站访问其数据,需要在“OAuth2”页面设置Redirects URL。对于仅仅获取服务器公共成员列表,使用Bot Token通常更直接。
  • Bot权限(Scopes/Intents): 如果您使用了Bot,请确保Bot在“Bot”页面启用了必要的“Privileged Gateway Intents”,例如GUILD_MEMBERS_INTENT,以便Bot能够获取服务器成员的详细信息。对于HTTP API,Bot Token需要具有相应的权限才能访问List Guild Members端点。

2. 使用Discord HTTP API获取成员列表

我们将使用GET /guilds/{guild.id}/members端点来获取服务器成员列表。

API端点:https://discord.com/api/v10/guilds/{guild.id}/members

请求参数:

AOXO_CMS建站系统企业通用版1.0
AOXO_CMS建站系统企业通用版1.0

一个功能强大、性能卓越的企业建站系统。使用静态网页技术大大减轻了服务器负担、加快网页的显示速度、提高搜索引擎推广效果。本系统的特点自定义模块多样化、速度快、占用服务器资源小、扩展性强,能方便快捷地建立您的企业展示平台。简便高效的管理操作从用户使用的角度考虑,对功能的操作方便性进行了设计改造。使用户管理的工作量减小。网站互动数据可导出Word文档,邮件同步发送功能可将互动信息推送到指定邮箱,加快企业

下载
  • guild.id:您的Discord服务器ID。
  • limit:可选,每次请求返回的成员数量,最大1000。如果服务器成员超过1000,需要进行分页处理(使用after参数)。

请求头:

  • Authorization: Bot YOUR_BOT_TOKEN (推荐使用Bot Token,因为它不涉及用户授权流程,更适合服务器端获取数据)

示例代码(JavaScript - 后端或代理):

import fetch from 'node-fetch'; // 在Node.js环境中使用,浏览器环境自带fetch

const GUILD_ID = 'YOUR_DISCORD_SERVER_ID'; // 替换为您的Discord服务器ID
const BOT_TOKEN = 'YOUR_BOT_TOKEN';       // 替换为您的Bot Token,请勿泄露!
const TARGET_ROLE_ID = 'YOUR_ROLE_ID';     // 替换为目标角色的ID

/**
 * 从Discord API获取所有服务器成员,并过滤出具有特定角色的成员。
 * 注意:此API不直接提供实时在线状态。如需实时状态,需结合Discord Gateway (Bot) 实现。
 * @param {string} roleId 要过滤的角色ID
 * @returns {Promise} 拥有特定角色的成员列表
 */
async function getMembersWithSpecificRole(roleId) {
    let allMembers = [];
    let lastMemberId = '0'; // 用于分页

    while (true) {
        try {
            const response = await fetch(
                `https://discord.com/api/v10/guilds/${GUILD_ID}/members?limit=1000&after=${lastMemberId}`,
                {
                    headers: {
                        'Authorization': `Bot ${BOT_TOKEN}`
                    }
                }
            );

            if (!response.ok) {
                // 处理API限速或其他错误
                const errorData = await response.json();
                console.error(`Error fetching guild members: ${response.status} - ${JSON.stringify(errorData)}`);
                // 如果是限速,可以尝试等待一段时间后重试
                if (response.status === 429) {
                    const retryAfter = response.headers.get('Retry-After');
                    console.warn(`Rate limited. Retrying after ${retryAfter} seconds.`);
                    await new Promise(resolve => setTimeout(resolve, parseInt(retryAfter) * 1000));
                    continue; // 重新尝试当前请求
                }
                throw new Error(`HTTP error! status: ${response.status}`);
            }

            const membersPage = await response.json();
            if (membersPage.length === 0) {
                break; // 没有更多成员了
            }

            allMembers = allMembers.concat(membersPage);
            lastMemberId = membersPage[membersPage.length - 1].user.id; // 更新最后一个成员ID进行下一页请求

            if (membersPage.length < 1000) {
                break; // 已经获取到最后一页
            }

        } catch (error) {
            console.error('Failed to fetch guild members:', error);
            return [];
        }
    }

    // 过滤出拥有特定角色的成员
    const filteredMembers = allMembers.filter(member =>
        member.roles && member.roles.includes(roleId)
    );

    return filteredMembers;
}

// 调用示例
getMembersWithSpecificRole(TARGET_ROLE_ID)
    .then(members => {
        console.log(`Members with role ${TARGET_ROLE_ID}:`, members.map(m => m.user.username));
        // 在前端展示这些成员,例如渲染到HTML列表中
    })
    .catch(error => console.error("Failed to get members:", error));

关于在线状态:List Guild Members端点返回的成员对象通常不包含实时的在线状态(presence)。要获取实时的在线状态,您需要使用一个连接到Discord Gateway的Bot,并启用GUILD_PRESENCES_INTENT。Bot会通过WebSocket接收实时的状态更新,然后您需要将这些状态数据通过Bot的自定义API提供给您的网站。

3. 前端展示

获取到成员数据后,您可以使用任何前端框架(如React, Vue, Angular)或纯JavaScript/HTML/CSS来展示这些信息。

// 假设您已经从后端API获取到了filteredMembers数据
function displayMembers(members) {
    const container = document.getElementById('members-list');
    if (!container) return;

    container.innerHTML = ''; // 清空现有内容

    if (members.length === 0) {
        container.innerHTML = '

没有找到拥有此角色的成员。

'; return; } const ul = document.createElement('ul'); members.forEach(member => { const li = document.createElement('li'); const username = member.nick || member.user.global_name || member.user.username; // 优先显示昵称 li.textContent = username; // 可以添加用户头像等信息 if (member.user.avatar) { const avatarUrl = `https://cdn.discordapp.com/avatars/${member.user.id}/${member.user.avatar}.png`; const img = document.createElement('img'); img.src = avatarUrl; img.alt = username; img.style.width = '24px'; img.style.height = '24px'; img.style.borderRadius = '50%'; img.style.marginRight = '8px'; li.prepend(img); } ul.appendChild(li); }); container.appendChild(ul); } // 示例调用 (假设在获取数据后执行) // getMembersWithSpecificRole(TARGET_ROLE_ID).then(members => { // displayMembers(members); // });

Discord 官方 Widget 的局限性

Discord官方提供了一个服务器Widget,可以嵌入到网站上,展示服务器的在线成员、频道列表等信息。虽然它能满足“展示所有在线成员”的部分需求,但其自定义能力非常有限。您无法通过Widget来过滤特定角色的成员,也无法获取语音时长或消息发送量等更深层次的统计数据。因此,对于高度定制化的需求,直接使用API是不可避免的。

注意事项与总结

  1. API限速(Rate Limits): Discord API有严格的限速机制。在进行API调用时,务必注意响应头中的X-RateLimit-Limit, X-RateLimit-Remaining, X-RateLimit-Reset-After等信息,避免频繁请求导致被暂时封禁。
  2. 安全性: 您的Bot Token和Client Secret是访问Discord API的关键凭证,务必妥善保管,绝不能在客户端(前端)代码中直接暴露。所有涉及凭证的API调用都应通过安全的后端服务器进行代理。
  3. 权限管理: 确保您的Bot或OAuth2应用拥有访问所需数据的最低必要权限(Scope)。例如,获取成员列表需要guilds.members.read权限。
  4. Bot开发的重要性: 对于需要实时监控、复杂统计或无法直接通过HTTP API获取的数据,开发一个Discord Bot是唯一的、也是最强大的解决方案。Bot可以监听实时事件,并将处理后的数据通过自定义API提供给您的网站。
  5. 数据更新策略: 对于静态或变化不频繁的数据,可以进行缓存以减少API调用。对于需要实时更新的数据(如在线状态),除了使用Bot的Gateway连接外,也可以考虑定期刷新HTTP API数据(但需注意限速)。

通过上述方法,您可以根据需求,灵活地在您的网站上展示各种自定义的Discord服务器数据,从而为用户提供更丰富的交互体验。

相关专题

更多
js获取数组长度的方法
js获取数组长度的方法

在js中,可以利用array对象的length属性来获取数组长度,该属性可设置或返回数组中元素的数目,只需要使用“array.length”语句即可返回表示数组对象的元素个数的数值,也就是长度值。php中文网还提供JavaScript数组的相关下载、相关课程等内容,供大家免费下载使用。

556

2023.06.20

js刷新当前页面
js刷新当前页面

js刷新当前页面的方法:1、reload方法,该方法强迫浏览器刷新当前页面,语法为“location.reload([bForceGet]) ”;2、replace方法,该方法通过指定URL替换当前缓存在历史里(客户端)的项目,因此当使用replace方法之后,不能通过“前进”和“后退”来访问已经被替换的URL,语法为“location.replace(URL) ”。php中文网为大家带来了js刷新当前页面的相关知识、以及相关文章等内容

374

2023.07.04

js四舍五入
js四舍五入

js四舍五入的方法:1、tofixed方法,可把 Number 四舍五入为指定小数位数的数字;2、round() 方法,可把一个数字舍入为最接近的整数。php中文网为大家带来了js四舍五入的相关知识、以及相关文章等内容

732

2023.07.04

js删除节点的方法
js删除节点的方法

js删除节点的方法有:1、removeChild()方法,用于从父节点中移除指定的子节点,它需要两个参数,第一个参数是要删除的子节点,第二个参数是父节点;2、parentNode.removeChild()方法,可以直接通过父节点调用来删除子节点;3、remove()方法,可以直接删除节点,而无需指定父节点;4、innerHTML属性,用于删除节点的内容。

477

2023.09.01

JavaScript转义字符
JavaScript转义字符

JavaScript中的转义字符是反斜杠和引号,可以在字符串中表示特殊字符或改变字符的含义。本专题为大家提供转义字符相关的文章、下载、课程内容,供大家免费下载体验。

394

2023.09.04

js生成随机数的方法
js生成随机数的方法

js生成随机数的方法有:1、使用random函数生成0-1之间的随机数;2、使用random函数和特定范围来生成随机整数;3、使用random函数和round函数生成0-99之间的随机整数;4、使用random函数和其他函数生成更复杂的随机数;5、使用random函数和其他函数生成范围内的随机小数;6、使用random函数和其他函数生成范围内的随机整数或小数。

991

2023.09.04

如何启用JavaScript
如何启用JavaScript

JavaScript启用方法有内联脚本、内部脚本、外部脚本和异步加载。详细介绍:1、内联脚本是将JavaScript代码直接嵌入到HTML标签中;2、内部脚本是将JavaScript代码放置在HTML文件的`<script>`标签中;3、外部脚本是将JavaScript代码放置在一个独立的文件;4、外部脚本是将JavaScript代码放置在一个独立的文件。

657

2023.09.12

Js中Symbol类详解
Js中Symbol类详解

javascript中的Symbol数据类型是一种基本数据类型,用于表示独一无二的值。Symbol的特点:1、独一无二,每个Symbol值都是唯一的,不会与其他任何值相等;2、不可变性,Symbol值一旦创建,就不能修改或者重新赋值;3、隐藏性,Symbol值不会被隐式转换为其他类型;4、无法枚举,Symbol值作为对象的属性名时,默认是不可枚举的。

552

2023.09.20

高德地图升级方法汇总
高德地图升级方法汇总

本专题整合了高德地图升级相关教程,阅读专题下面的文章了解更多详细内容。

43

2026.01.16

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Sass 教程
Sass 教程

共14课时 | 0.8万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 2.9万人学习

CSS教程
CSS教程

共754课时 | 20万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号