99 lines
8.4 KiB
XML
99 lines
8.4 KiB
XML
<?xml version="1.0" encoding="UTF-8"?>
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="1198" height="487" viewBox="0 0 1198 487" role="img" aria-labelledby="diagram-title diagram-description">
|
|
<title id="diagram-title">승인된 결제는 주문 상태 갱신 후 이벤트로 확산된다</title>
|
|
<desc id="diagram-description">왼쪽에서 오른쪽으로 읽는다. 클라이언트가 HTTPS 결제 요청을 인증 게이트웨이에 보내고, 검증된 요청이 체크아웃 API로 전달된다. 체크아웃 API는 PostgreSQL에 PENDING 주문을 기록하고 결제 제공자 API에 승인을 요청한다. 승인 응답을 받으면 같은 주문을 PAID로 갱신하고 payment.approved 이벤트를 이벤트 버스에 발행한다.</desc>
|
|
<metadata>{"techviz":{"spec_version":"1.1","id":"payment-request","profile":"component-flow"},"source_context":{"document":"examples/docs/payment-flow.md","document_sha256":"d1449d2ad322f11e735bf5c98ee33311d03ff893ef91eb97b5422f6cc04b0e7c","anchor":{"kind":"marker","value":"payment-request","line":15}},"evidence_policy":"Each factual element cites source lines or is marked assumption.","diagram_only":true}</metadata>
|
|
<defs>
|
|
<marker id="arrow" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse">
|
|
<path d="M 0 0 L 10 5 L 0 10 z" />
|
|
</marker>
|
|
<style>
|
|
:root { color-scheme: light; }
|
|
text { font-family: Inter, Pretendard, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; fill: #111827; }
|
|
.canvas { fill: #ffffff; }
|
|
.group-box { fill: #ffffff; stroke: #9ca3af; stroke-width: 1.4; stroke-dasharray: 7 5; }
|
|
.group-label-bg { fill: #ffffff; }
|
|
.group-label { font-size: 13px; font-weight: 650; fill: #374151; }
|
|
.edge { fill: none; stroke: #374151; stroke-width: 1.8; stroke-linejoin: round; stroke-linecap: round; marker-end: url(#arrow); }
|
|
.edge.style-dashed, .edge.semantic-dashed, .edge.assumption { stroke-dasharray: 7 5; }
|
|
.edge.style-dotted { stroke-dasharray: 2 5; }
|
|
.edge.emphasis-primary { stroke: #2563eb; stroke-width: 2.2; }
|
|
.edge.emphasis-muted { stroke: #9ca3af; }
|
|
.edge.emphasis-warning, .edge.kind-failure, .edge.kind-error { stroke: #dc2626; stroke-width: 2.2; }
|
|
.edge-label-bg { fill: #ffffff; }
|
|
.edge-label { font-size: 12px; font-weight: 560; text-anchor: middle; }
|
|
.node-shape { fill: #ffffff; stroke: #4b5563; stroke-width: 1.7; }
|
|
.node-shape.emphasis-primary { stroke: #2563eb; stroke-width: 2.2; }
|
|
.node-shape.emphasis-muted { stroke: #9ca3af; fill: #f9fafb; }
|
|
.node-shape.emphasis-warning { stroke: #d97706; stroke-width: 2; fill: #fffdf5; }
|
|
.node-shape.kind-database, .node-shape.kind-datastore, .node-shape.kind-storage { fill: #f8fafc; }
|
|
.node-shape.kind-queue, .node-shape.kind-event, .node-shape.kind-topic { fill: #fafafa; }
|
|
.node-shape.assumption { stroke-dasharray: 4 4; }
|
|
.storage-bottom, .controller-divider { fill: none; stroke: #4b5563; stroke-width: 1.4; }
|
|
.controller-led { fill: #4b5563; }
|
|
.actor-symbol { fill: none; stroke: #4b5563; stroke-width: 1.8; stroke-linecap: round; }
|
|
.actor-symbol.emphasis-primary { stroke: #2563eb; stroke-width: 2.2; }
|
|
.node-label { font-size: 14px; font-weight: 650; text-anchor: middle; }
|
|
.node-role { font-size: 10px; letter-spacing: 0.04em; text-anchor: middle; fill: #6b7280; }
|
|
.node-detail-divider { stroke: #d1d5db; stroke-width: 1; }
|
|
.node-detail { font-size: 11px; fill: #374151; }
|
|
.assumption-badge { font-size: 9px; font-weight: 700; fill: #92400e; }
|
|
.failure-mark { stroke: #dc2626; stroke-width: 4; stroke-linecap: round; }
|
|
.lifeline { stroke: #9ca3af; stroke-width: 1.2; stroke-dasharray: 5 5; }
|
|
.timeline-axis { stroke: #374151; stroke-width: 1.8; marker-end: url(#arrow); }
|
|
.timeline-stem { stroke: #6b7280; stroke-width: 1.3; }
|
|
.timeline-marker { fill: #ffffff; stroke: #374151; stroke-width: 1.7; }
|
|
.timeline-marker.primary { fill: #2563eb; stroke: #2563eb; }
|
|
.timeline-marker.warning { fill: #dc2626; stroke: #dc2626; }
|
|
.timeline-label { font-size: 13px; font-weight: 650; text-anchor: middle; }
|
|
.timeline-detail { font-size: 11px; fill: #4b5563; text-anchor: middle; }
|
|
</style>
|
|
</defs>
|
|
<rect class="canvas" width="1198" height="487" />
|
|
<polyline class="edge kind-response style-dashed emphasis-normal semantic-dashed" points="1076.5,396.0 1076.5,442.0 765.0,442.0 765.0,260.0" data-evidence="13-13" />
|
|
<rect class="edge-label-bg" x="827.0" y="400.0" width="51.5" height="22" rx="3" />
|
|
<text class="edge-label" x="852.8" y="415.0">승인 응답</text>
|
|
<polyline class="edge kind-request style-solid emphasis-normal" points="840.0,247.8 930.8,247.8 930.8,373.0 1001.5,373.0" data-evidence="13-13" />
|
|
<rect class="edge-label-bg" x="881.0" y="286.4" width="51.5" height="22" rx="3" />
|
|
<text class="edge-label" x="906.8" y="301.4">승인 요청</text>
|
|
<polyline class="edge kind-request style-solid emphasis-normal" points="220.0,228.0 300.0,228.0 300.0,228.0 380.0,228.0" data-evidence="11-11" />
|
|
<rect class="edge-label-bg" x="254.2" y="186.0" width="91.7" height="22" rx="3" />
|
|
<text class="edge-label" x="300.0" y="201.0">HTTPS 결제 요청</text>
|
|
<polyline class="edge kind-data style-solid emphasis-normal" points="840.0,218.1 920.0,218.1 920.0,219.0 1000.0,219.0" data-evidence="13-13" />
|
|
<rect class="edge-label-bg" x="891.5" y="204.5" width="105.1" height="22" rx="3" />
|
|
<text class="edge-label" x="944.0" y="219.5">PENDING 주문 기록</text>
|
|
<polyline class="edge kind-data style-solid emphasis-normal" points="840.0,228.0 930.0,228.0 930.0,237.0 1000.0,237.0" data-evidence="13-13" />
|
|
<rect class="edge-label-bg" x="882.0" y="242.0" width="85.0" height="22" rx="3" />
|
|
<text class="edge-label" x="924.5" y="257.0">PAID 상태 갱신</text>
|
|
<polyline class="edge kind-publish style-dashed emphasis-primary semantic-dashed" points="840.0,208.2 920.8,208.2 920.8,92.0 1001.5,92.0" data-evidence="13-13" />
|
|
<rect class="edge-label-bg" x="872.1" y="136.1" width="145.3" height="22" rx="3" />
|
|
<text class="edge-label" x="944.8" y="151.1">payment.approved 발행</text>
|
|
<polyline class="edge kind-request style-solid emphasis-normal" points="530.0,228.0 610.0,228.0 610.0,228.0 690.0,228.0" data-evidence="11-11" />
|
|
<rect class="edge-label-bg" x="570.9" y="186.0" width="78.3" height="22" rx="3" />
|
|
<text class="edge-label" x="610.0" y="201.0">검증된 요청 전달</text>
|
|
<g id="node-client">
|
|
<g class="actor-symbol emphasis-normal" data-evidence="7-7,11-11"><circle cx="145.0" cy="206.0" r="11.0" /><line x1="145.0" y1="222.0" x2="145.0" y2="241.0" /><line x1="127.0" y1="232.0" x2="163.0" y2="232.0" /><line x1="145.0" y1="241.0" x2="130.0" y2="258.0" /><line x1="145.0" y1="241.0" x2="160.0" y2="258.0" /></g>
|
|
<text class="node-label" x="145.0" y="263.0">클라이언트</text>
|
|
</g>
|
|
<g id="node-auth-gateway">
|
|
<rect class="node-shape kind-security emphasis-normal role-service" data-evidence="7-7,11-11" x="380.0" y="196.0" width="150.0" height="64.0" rx="7" />
|
|
<text class="node-label" x="455.0" y="226.0">인증 게이트웨이</text>
|
|
</g>
|
|
<g id="node-checkout-api">
|
|
<rect class="node-shape kind-service emphasis-primary role-service" data-evidence="7-7,11-13" x="690.0" y="196.0" width="150.0" height="64.0" rx="7" />
|
|
<text class="node-label" x="765.0" y="226.0">체크아웃 API</text>
|
|
</g>
|
|
<g id="node-event-bus">
|
|
<rect class="node-shape kind-queue emphasis-normal role-sink" data-evidence="13-13" x="1001.5" y="60.0" width="150.0" height="64.0" rx="22" />
|
|
<text class="node-label" x="1076.5" y="90.0">이벤트 버스</text>
|
|
</g>
|
|
<g id="node-orders-db">
|
|
<rect class="node-shape kind-database emphasis-normal role-store" data-evidence="13-13" x="1000.0" y="206.7" width="153.0" height="42.7" /><ellipse class="node-shape kind-database emphasis-normal role-store" cx="1076.5" cy="206.7" rx="76.5" ry="10.7" /><path class="storage-bottom" d="M 1000.0 249.3 A 76.5 10.7 0 0 0 1153.0 249.3" />
|
|
<text class="node-label" x="1076.5" y="226.0">PostgreSQL 주문 저장소</text>
|
|
</g>
|
|
<g id="node-payment-provider">
|
|
<rect class="node-shape kind-service emphasis-normal role-service" data-evidence="13-13" x="1001.5" y="332.0" width="150.0" height="64.0" rx="7" />
|
|
<text class="node-label" x="1076.5" y="362.0">결제 제공자 API</text>
|
|
</g>
|
|
</svg>
|