97 lines
7.4 KiB
XML
97 lines
7.4 KiB
XML
<?xml version="1.0" encoding="UTF-8"?>
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="1214" height="587" viewBox="0 0 1214 587" 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.0","id":"payment-request"},"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."}</metadata>
|
|
<defs>
|
|
<marker id="arrow" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="8" markerHeight="8" orient="auto-start-reverse">
|
|
<path d="M 0 0 L 10 5 L 0 10 z" />
|
|
</marker>
|
|
<filter id="soft-shadow" x="-20%" y="-20%" width="140%" height="140%">
|
|
<feDropShadow dx="0" dy="2" stdDeviation="2" flood-opacity="0.16" />
|
|
</filter>
|
|
<style>
|
|
:root { color-scheme: light; }
|
|
text { font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; fill: #17202a; }
|
|
.canvas { fill: #ffffff; }
|
|
.diagram-title { font-size: 24px; font-weight: 700; }
|
|
.diagram-question { font-size: 14px; fill: #4d5966; }
|
|
.group-box { fill: #f7f9fb; stroke: #66788a; stroke-width: 1.5; stroke-dasharray: 7 5; }
|
|
.group-label-bg { fill: #ffffff; }
|
|
.group-label { font-size: 13px; font-weight: 650; fill: #334455; }
|
|
.edge { fill: none; stroke: #364b5f; stroke-width: 2; stroke-linejoin: round; marker-end: url(#arrow); }
|
|
.edge.async, .edge.event, .edge.publish { stroke-dasharray: 7 5; }
|
|
.edge.assumption { stroke-dasharray: 3 5; }
|
|
.edge-label-bg { fill: #ffffff; stroke: #d5dce3; stroke-width: 1; rx: 5; }
|
|
.edge-label { font-size: 12px; font-weight: 560; text-anchor: middle; }
|
|
.node-shape { fill: #ffffff; stroke: #2d4357; stroke-width: 2; }
|
|
.kind-external, .kind-actor, .kind-user { fill: #f5f7fa; stroke-dasharray: 6 4; }
|
|
.kind-database, .kind-datastore, .kind-storage { fill: #eef6fb; }
|
|
.kind-queue, .kind-event, .kind-topic { fill: #f6f1fb; }
|
|
.kind-decision, .kind-gateway { fill: #fff7e8; }
|
|
.kind-security, .kind-auth { fill: #fdf0f0; }
|
|
.node-shape.assumption { stroke-dasharray: 4 4; }
|
|
.storage-bottom { fill: none; stroke: #2d4357; stroke-width: 2; }
|
|
.node-label { font-size: 14px; font-weight: 650; text-anchor: middle; }
|
|
.node-kind { font-size: 10px; letter-spacing: 0.07em; text-transform: uppercase; text-anchor: middle; fill: #5d6975; }
|
|
.assumption-badge { font-size: 9px; font-weight: 700; fill: #7a4300; }
|
|
.footer { font-size: 10px; fill: #697783; }
|
|
</style>
|
|
</defs>
|
|
<rect class="canvas" width="1214" height="587" />
|
|
<text class="diagram-title" x="50" y="42">승인된 결제는 주문 상태 갱신 후 이벤트로 확산된다</text>
|
|
<text class="diagram-question" x="50" y="67">결제 요청은 어디를 거쳐 저장되고 승인 후 어떤 이벤트를 발행하는가?</text>
|
|
<polyline class="edge response" points="1077.2,481.0 1077.2,527.0 765.0,527.0 765.0,345.0" data-evidence="13-13" />
|
|
<rect class="edge-label-bg" x="827.1" y="485.0" width="52.0" height="22" />
|
|
<text class="edge-label" x="853.1" y="500.0">승인 응답</text>
|
|
<polyline class="edge request" points="840.0,332.8 931.1,332.8 931.1,458.0 1002.2,458.0" data-evidence="13-13" />
|
|
<rect class="edge-label-bg" x="881.1" y="371.4" width="52.0" height="22" />
|
|
<text class="edge-label" x="907.1" y="386.4">승인 요청</text>
|
|
<polyline class="edge request" points="220.0,313.0 300.0,313.0 300.0,313.0 380.0,313.0" data-evidence="11-11" />
|
|
<rect class="edge-label-bg" x="253.6" y="271.0" width="92.8" height="22" />
|
|
<text class="edge-label" x="300.0" y="286.0">HTTPS 결제 요청</text>
|
|
<polyline class="edge data" points="840.0,303.1 920.0,303.1 920.0,304.0 1000.0,304.0" data-evidence="13-13" />
|
|
<rect class="edge-label-bg" x="890.8" y="289.5" width="106.4" height="22" />
|
|
<text class="edge-label" x="944.0" y="304.5">PENDING 주문 기록</text>
|
|
<polyline class="edge data" points="840.0,313.0 930.0,313.0 930.0,322.0 1000.0,322.0" data-evidence="13-13" />
|
|
<rect class="edge-label-bg" x="881.5" y="327.0" width="86.0" height="22" />
|
|
<text class="edge-label" x="924.5" y="342.0">PAID 상태 갱신</text>
|
|
<polyline class="edge publish" points="840.0,293.2 921.1,293.2 921.1,177.0 1002.2,177.0" data-evidence="13-13" />
|
|
<rect class="edge-label-bg" x="871.5" y="221.1" width="147.2" height="22" />
|
|
<text class="edge-label" x="945.1" y="236.1">payment.approved 발행</text>
|
|
<polyline class="edge request" points="530.0,313.0 610.0,313.0 610.0,313.0 690.0,313.0" data-evidence="11-11" />
|
|
<rect class="edge-label-bg" x="570.4" y="271.0" width="79.2" height="22" />
|
|
<text class="edge-label" x="610.0" y="286.0">검증된 요청 전달</text>
|
|
<g id="node-client">
|
|
<rect class="node-shape kind-actor" data-evidence="7-7,11-11" x="70.0" y="281.0" width="150.0" height="64.0" rx="10" />
|
|
<text class="node-kind" x="145.0" y="298.0">actor</text>
|
|
<text class="node-label" x="145.0" y="320.0">클라이언트</text>
|
|
</g>
|
|
<g id="node-auth-gateway">
|
|
<rect class="node-shape kind-security" data-evidence="7-7,11-11" x="380.0" y="281.0" width="150.0" height="64.0" rx="10" />
|
|
<text class="node-kind" x="455.0" y="298.0">security</text>
|
|
<text class="node-label" x="455.0" y="320.0">인증 게이트웨이</text>
|
|
</g>
|
|
<g id="node-checkout-api">
|
|
<rect class="node-shape kind-service" data-evidence="7-7,11-13" x="690.0" y="281.0" width="150.0" height="64.0" rx="10" />
|
|
<text class="node-kind" x="765.0" y="298.0">service</text>
|
|
<text class="node-label" x="765.0" y="320.0">체크아웃 API</text>
|
|
</g>
|
|
<g id="node-event-bus">
|
|
<rect class="node-shape kind-queue" data-evidence="13-13" x="1002.2" y="145.0" width="150.0" height="64.0" rx="26" />
|
|
<text class="node-kind" x="1077.2" y="162.0">queue</text>
|
|
<text class="node-label" x="1077.2" y="184.0">이벤트 버스</text>
|
|
</g>
|
|
<g id="node-orders-db">
|
|
<rect class="node-shape kind-database" data-evidence="13-13" x="1000.0" y="291.7" width="154.4" height="42.7" /><ellipse class="node-shape kind-database" cx="1077.2" cy="291.7" rx="77.2" ry="10.7" /><path class="storage-bottom" d="M 1000.0 334.3 A 77.2 10.7 0 0 0 1154.4 334.3" />
|
|
<text class="node-kind" x="1077.2" y="298.0">database</text>
|
|
<text class="node-label" x="1077.2" y="320.0">PostgreSQL 주문 저장소</text>
|
|
</g>
|
|
<g id="node-payment-provider">
|
|
<rect class="node-shape kind-service" data-evidence="13-13" x="1002.2" y="417.0" width="150.0" height="64.0" rx="10" />
|
|
<text class="node-kind" x="1077.2" y="434.0">service</text>
|
|
<text class="node-label" x="1077.2" y="456.0">결제 제공자 API</text>
|
|
</g>
|
|
<text class="footer" x="50" y="565.0">Generated from grounded VizSpec · editable sources are versioned separately</text>
|
|
</svg>
|