模板 / sequenceDiagram

WebSocket 连接生命周期

升级握手、心跳循环和优雅关闭——用于说明实时连接的模板。

在 Studio 中打开

预览

Mermaid 11 渲染器

正在渲染预览...

Mermaid 源码

sequenceDiagram

sequenceDiagram
    participant Client
    participant Server

    Client->>Server: HTTP upgrade request
    Server-->>Client: 101 Switching Protocols
    loop Heartbeat every 30s
        Client->>Server: ping
        Server-->>Client: pong
    end
    Client->>Server: Close frame
    Server-->>Client: Close acknowledged

更多模板

flowchartArchitecture

微服务架构

包含 API 网关、核心服务和共享基础设施的服务拓扑图,适合用作 README 架构说明的起点。

sequenceDiagramProcess

用户登录时序图

包含令牌签发与失败分支的登录流程,适合用来说明鉴权接口和会话行为。

stateDiagram-v2Process

订单状态机

电商订单从创建到履约的生命周期状态,包含取消和退款路径。