用 AI 画时序图：接口调用与系统交互

提示词

请用 Mermaid 代码帮我画一张时序图，描述：用户登录时前端、网关、用户服务、短信服务之间的调用。要求：直接给出完整的 mermaid 代码块，第一行是 sequenceDiagram，用 participant 声明参与者，消息用 ->> 和 -->>，文字用中文。

把参与者列出来、把主要的失败分支说一句（「验证码错误时返回失败」），回复会更完整。

一段典型结果

sequenceDiagram
    autonumber
    participant U as 用户
    participant F as 前端
    participant G as 网关
    participant S as 用户服务
    U->>F: 输入手机号，点击获取验证码
    F->>G: POST /sms/send
    G->>S: 发送验证码
    S-->>G: 已发送
    G-->>F: 200 OK
    U->>F: 输入验证码，登录
    F->>G: POST /login
    G->>S: 校验验证码
    alt 验证码正确
        S-->>G: 签发 token
        G-->>F: 200 + token
        F-->>U: 进入首页
    else 验证码错误或过期
        S-->>G: 校验失败
        G-->>F: 401
        F-->>U: 提示重新输入
    end

语法速查

• 参与者：participant S as 用户服务，别名写在 as 后面，出场顺序就是声明顺序；actor U as 用户 会画成小人。
• 消息：A->>B: 文字 实线（请求），A-->>B: 文字 虚线（响应）。冒号后面是消息文本，箭头后面必须跟参与者。
• 块：alt 条件 … else … end、opt 可选 … end、loop 每 5 秒 … end、par 并行 … and … end，每个块都要 end 收尾。
• 备注：Note over F,G: 这里走 HTTPS，Note right of S: 缓存 5 分钟。
• 激活条：A->>+B: 开始 与 B-->>-A: 结束，+ / - 让 B 的生命线上出现一段激活条。
• 编号：第二行写 autonumber，每条消息自动带序号。

改内容

时序图不支持在预览里双击改字，直接在代码里改：改参与者名字改 as 后面的文字（前面的短 id 不用动），改消息改冒号后面。加一条消息就加一行，插在哪里就在哪个位置出现。

报错

时序图最常见的报错是「消息行不完整」：箭头后面漏了参与者，或者冒号漏了。另一种是块缺 end。报错条会定位到行；「AI 修复」也能处理。

导出

放进技术文档常用 PNG ×2 透明底或 SVG；参与者多、图很宽时，导出前把倍率切到 ×3 更清楚。Word / PPT 文末附代码，以后改接口名字直接复制回来。模板库里有登录认证、在线支付、微服务调用三套时序图模板。

相关

• 用 AI 画流程图
• 导出到 Word、PPT、PDF
• 常见报错怎么改