Files
cpp-httplib/docs-src/pages/ja/tour/08-websocket.md
yhirose 797758a742 Documentation Site on GitHub Pages (#2376)
* Add initial documentations

* Update documentation for Basic Client and add WebSocket section

* feat: add a static site generator with multi-language support

- Introduced a new Rust-based static site generator in the `docs-gen` directory.
- Implemented core functionality for building sites from markdown files, including:
  - Configuration loading from `config.toml`.
  - Markdown rendering with frontmatter support.
  - Navigation generation based on page structure.
  - Static file copying and output directory management.
- Added templates for base layout, pages, and portal.
- Created a CSS file for styling and a JavaScript file for interactive features like language selection and theme toggling.
- Updated documentation source with new configuration and example pages in English and Japanese.
- Added a `justfile` target for building the documentation site.

* Add language/theme toggle functionality

- Created a new Japanese tour index page at docs/ja/tour/index.html
- Implemented navigation links for various sections of the cpp-httplib tutorial
- Added a language selector to switch between English and Japanese
- Introduced theme toggle functionality to switch between light and dark modes
- Added mobile sidebar toggle for better navigation on smaller screens
2026-02-28 14:45:40 -05:00

4.2 KiB
Raw Blame History

title, order
title order
WebSocket 8

cpp-httplibはWebSocketにも対応しています。HTTPのリクエスト/レスポンスと違い、WebSocketはサーバーとクライアントが双方向にメッセージをやり取りできます。チャットやリアルタイム通知に便利です。

さっそく、エコーサーバーとクライアントを作ってみましょう。

エコーサーバー

受け取ったメッセージをそのまま返すエコーサーバーです。

#include "httplib.h"
#include <iostream>

int main() {
    httplib::Server svr;

    svr.WebSocket("/ws", [](const httplib::Request &, httplib::ws::WebSocket &ws) {
        std::string msg;
        while (ws.read(msg)) {
            ws.send(msg);  // 受け取ったメッセージをそのまま返す
        }
    });

    std::cout << "Listening on port 8080..." << std::endl;
    svr.listen("0.0.0.0", 8080);
}

svr.WebSocket() でWebSocketハンドラーを登録します。3章の svr.Get()svr.Post() と同じ感覚ですね。

ハンドラーの中では、ws.read(msg) でメッセージを待ちます。接続が閉じられると read()false を返すので、ループを抜けます。ws.send(msg) でメッセージを送り返します。

クライアントからの接続

httplib::ws::WebSocketClient を使ってサーバーに接続してみましょう。

#include "httplib.h"
#include <iostream>

int main() {
    httplib::ws::WebSocketClient client("ws://localhost:8080/ws");

    if (!client.connect()) {
        std::cout << "Connection failed" << std::endl;
        return 1;
    }

    // メッセージを送信
    client.send("Hello, WebSocket!");

    // サーバーからの応答を受信
    std::string msg;
    if (client.read(msg)) {
        std::cout << msg << std::endl;  // Hello, WebSocket!
    }

    client.close();
}

コンストラクタには ws://host:port/path 形式のURLを渡します。connect() で接続を開始し、send()read() でメッセージをやり取りします。

テキストとバイナリ

WebSocketにはテキストとバイナリの2種類のメッセージがあります。read() の戻り値で区別できます。

svr.WebSocket("/ws", [](const httplib::Request &, httplib::ws::WebSocket &ws) {
    std::string msg;
    httplib::ws::ReadResult ret;
    while ((ret = ws.read(msg))) {
        if (ret == httplib::ws::Binary) {
            ws.send(msg.data(), msg.size());  // バイナリとして送信
        } else {
            ws.send(msg);  // テキストとして送信
        }
    }
});
  • ws.send(const std::string &) — テキストメッセージとして送信
  • ws.send(const char *, size_t) — バイナリメッセージとして送信

クライアント側も同じAPIです。

リクエスト情報へのアクセス

ハンドラーの第1引数 req から、ハンドシェイク時のHTTPリクエスト情報を読み取れます。認証トークンの確認などに便利です。

svr.WebSocket("/ws", [](const httplib::Request &req, httplib::ws::WebSocket &ws) {
    auto token = req.get_header_value("Authorization");
    if (token.empty()) {
        ws.close(httplib::ws::CloseStatus::PolicyViolation, "unauthorized");
        return;
    }

    std::string msg;
    while (ws.read(msg)) {
        ws.send(msg);
    }
});

WSSで使う

HTTPS上のWebSocketWSSにも対応しています。サーバー側は httplib::SSLServer にWebSocketハンドラーを登録するだけです。

httplib::SSLServer svr("cert.pem", "key.pem");

svr.WebSocket("/ws", [](const httplib::Request &, httplib::ws::WebSocket &ws) {
    std::string msg;
    while (ws.read(msg)) {
        ws.send(msg);
    }
});

svr.listen("0.0.0.0", 8443);

クライアント側は wss:// スキームを使います。

httplib::ws::WebSocketClient client("wss://localhost:8443/ws");

次のステップ

WebSocketの基本がわかりましたね。ここまでで Tourは終わりです。

次のページでは、Tourで取り上げなかった機能をまとめて紹介します。

次: What's Next