كيفية كتابة مخطط mermaid تسلسلي
يوضح المخطط التسلسلي من يتحدث إلى من، وبأي ترتيب. في mermaid يستغرق كتابته وقتًا يقارب وصفه بصوت عالٍ، ولهذا يبقى هذا النوع من المخططات الأطول عمرًا في قاعدة الكود. كل ما يلي جاهز للنسخ واللصق في المحرر.
الحد الأدنى
أعلن نوع المخطط، ثم اكتب سطرًا واحدًا لكل رسالة. يُنشأ المشاركون عند أول ذكر لهم، بحسب ترتيب ظهورهم.
sequenceDiagram
User->>API: POST /orders
API->>DB: INSERT order
DB-->>API: order id
API-->>User: 201 Createdأعلن المشاركين صراحةً باستخدام participant User عندما تريد ترتيبًا محددًا من اليسار إلى اليمين بدلًا من ترتيب أول ذكر.
أنواع الأسهم
| الصياغة | المعنى |
|---|---|
A->>B: text | طلب — خط متصل، رأس سهم مملوء |
A-->>B: text | استجابة — خط متقطع، رأس سهم مملوء |
A->B: text | خط متصل، رأس سهم مفتوح |
A-)B: text | رسالة غير متزامنة — رأس سهم مفتوح، بلا رد متوقع |
A-xB: text | رسالة تفشل أو تُفقد |
العرف الذي يستحق الحفاظ عليه: خط متصل للاستدعاء، وخط متقطع للعودة. عندها يمكن للقارئ تمييز الطلب من الاستجابة دون قراءة أي تسمية.
المشاركون والأسماء المستعارة
sequenceDiagram
participant U as Browser
participant A as API gateway
participant S as Order service
U->>A: GET /orders
A->>S: list(userId)
S-->>A: orders
A-->>U: 200 OKاستخدم actor U as Browser بدلًا من participant لرسم شخصية بشرية بسيطة — مفيد للطرف البشري عند حافة تدفق المصادقة.
أشرطة التفعيل
توضح أشرطة التفعيل مدة انشغال المشارك. إما أن تحددها صراحةً باستخدام activate/deactivate، أو تضيف + و- إلى الأسهم، وهو أقصر وأصعب أن يفقد توازنه.
sequenceDiagram
User->>+API: POST /pay
API->>+Bank: charge
Bank-->>-API: authorised
API-->>-User: receiptالحلقات والشروط والعمل المتوازي
sequenceDiagram
User->>API: POST /import
loop every row
API->>DB: upsert row
end
alt all rows valid
API-->>User: 200 OK
else some failed
API-->>User: 422 with errors
end
par notify
API->>Email: send summary
and audit
API->>Log: write entry
endloop <label>…end— تكرار.alt <label>…else <label>…end— فروع متنافية.opt <label>…end— فرع قد لا يحدث ببساطة.par <label>…and <label>…end— أشياء تحدث في الوقت نفسه.critical/break— قسم يجب ألا يُقاطَع، ومخرج مبكر.
الملاحظات
sequenceDiagram
User->>API: POST /login
Note right of API: Rate limited<br>5 per minute
API-->>User: token
Note over User,API: Token is valid for 30 daysNote over A,B تمتد عبر مشاركين اثنين، وهي المكان المناسب لقيد ينتمي إلى التفاعل نفسه لا إلى أحد طرفيه.
مثال كامل
sequenceDiagram
actor U as User
participant A as App
participant P as Provider
U->>+A: Click "Sign in"
A-->>-U: Redirect to provider
U->>+P: Authorise
P-->>-U: Redirect back with code
U->>+A: GET /callback?code=…
A->>+P: Exchange code for token
P-->>-A: access token
Note right of A: Session cookie set here
A-->>-U: Signed inعدّل هذا المخطط
الصقه في تبويب الكود وغيّر سطرًا — تُعاد المعاينة رسمها أثناء الكتابة.
أسئلة متكررة
كيف أرقّم الرسائل؟
ضع autonumber في السطر الذي يلي sequenceDiagram مباشرة. عندها تحصل كل رسالة على رقم تسلسلي، مما يسهّل الحديث عن المخطط في تعليقات المراجعة.
هل يمكن لمشارك إرسال رسالة إلى نفسه؟
نعم — اكتب الاسم نفسه على الطرفين: API->>API: retry. يرسم mermaid الحلقة عائدة إلى خط الحياة نفسه.
كيف أوضح أن مشاركًا قد أُنهي؟
استخدم destroy <name> قبل الرسالة التي تنهيه، أو create participant <name> لجعله يظهر في منتصف المخطط بدلًا من الأعلى.
هل يمكنني تعديل مخطط تسلسلي على اللوحة البصرية؟
اللوحة البصرية تعدّل المخططات الانسيابية فقط. تُكتب المخططات التسلسلية في تبويب الكود، حيث تُعرض مباشرة في المعاينة — وهذا عادةً أسرع على أي حال، لأن المخطط التسلسلي هو أساسًا قائمة أسطر.