【Discord】Discordのメッセージを取得しWEBに公開する

これはDiscordでのチャット投稿をトリガーに、AIが文脈を補完して公式告知風のHTML記事を生成し、専用のWebサイトおよび外部サイト（RSS）へ自動配信するシステムです。

概要

開発の背景: 運営の負担を減らしつつ、Discord内の速報性を公式サイトの「公式感」や「物語性」に昇華させることを目的としています。

コア機能: Discordメッセージのリアルタイム監視と過去ログ取得。

  • AIを活用した、物語性のある告知記事（HTML）への自動変換。
  • Node.js/Expressによる専用ニュースサイトの構築と、フィルタリング機能。
  • RSSフィード生成および、外部WordPress等への動的埋め込み機能。

システムアーキテクチャ

本システムは、情報の「抽出・変換」を担うPythonボットと、「蓄積・表示」を担うNode.jsサーバーの2層構造で構成されています。

使用技術スタック

カテゴリ技術 / ライブラリ
言語Python 3.10, Node.js (JavaScript)
Discord Botdiscord.py (aiohttp, asyncio)
AI / NLPOpenAI API (GPT-5-nano) / Ollama Gemma12b
BackendExpress.js
FrontendEJS (Embedded JavaScript templates), CSS3
Data StorageJSON-based Local Storage (Vertical File System)

技術的特徴と工夫点

① AIによる「物語性」の付与

単なる要約ではなく、シニアライターの役割をプロンプトで定義し、Discordの断片的な情報を「ゆとりのある配置」と「丁寧な言葉遣い」の公式記事へと膨らませています。

  • 自動クリーンアップ: AIが生成したコードブロック（“`html等）を自動除去し、即座にWeb表示可能な純粋なHTMLを抽出するロジックを実装しています。

② 柔軟なコンテンツ管理

  • チャンネル固有の処理: 特定のチャンネルIDからの投稿に対しては、投稿者名を自動的に固定するなど、ブランド管理機能を備えています。
  • 重複防止: processed_messages.json を用いたメッセージID管理により、再起動時の重複投稿を防止しています。

③ ユーザー体験を重視したWebフロントエンド

  • 動的フィルタリング: 投稿者別、年月別での絞り込み検索機能を搭載。
  • RSS統合: 外部サイト（WordPress等）のRSSと、本システムのRSSをクライアントサイドで統合して表示する組み込み用JSを提供し、プラットフォームを跨いだ情報集約を実現しています。

4. 各コンポーネントの役割

🤖 Bot側 (bot.py)

  • Discordの on_ready で過去10件の未処理メッセージを走査。
  • 画像アタッチメントのURLを抽出し、AIへのコンテキストとして提供。
  • API Secretを用いた認証付きPOSTリクエストによるWebサーバーへのデータ転送。

🌐 Server側 (server.js, views/*.ejs)

  • チャンネルごとに独立したJSONファイルでデータを管理し、高速な読み込みを実現。
  • formatDate 関数による、テンプレートを跨いだ統一的な日付表示。
  • RSS 2.0 規格に準拠したフィード出力機能。

📰 Embed側 (rss_embed.html)

  • Promise.allSettled を利用し、複数のRSSソース（Discord発告知 & WordPress告知）を非同期に取得。
  • 取得したデータを日付順にマージして再ソートし、シームレスなニュースフィードとしてレンダリング。

5. 今後の展望

  • 画像の自動最適化: DiscordのURLだけでなく、サーバー側で画像をキャッシュ・リサイズする機能。
  • 多言語展開: AIを活用した、記事の多言語同時生成。

Related Posts

PAGE TOP