docs(keycloak-session-store): remake all 28 diagrams through the techviz pipeline

The originating repository's SVGs were drawn by hand and every one of them
put a title, a subtitle and an explanation band inside the canvas. This
repository forbids both, so they could not be carried over — the whole set
was rebuilt through the skill's pipeline instead.

Each diagram went through prepare, references, prompt, a VizSpec 1.1 citing
document line ranges, lint, and render. All 28 pass lint and produce the
same eight formats the existing keycloak project has. Sentences moved out of
the canvas into <desc> and the paragraph beside each figure; the drawings
carry names only.

Two lint rules did real work rather than formatting work:

  edge-through-node                  caught arrows crossing an unrelated
                                     node and implying an adjacency that
                                     does not exist — four diagrams had to
                                     be restructured, not just relaid out
  evidence-outside-prepared-context  caught a diagram citing another
                                     section; its anchor moved from B-0 to
                                     B-1 so all three sections it draws on
                                     are inside the prepared context

lab-topology also had to change profile: its context offers a different
candidate set, and query-fanout with shard roles is what the section
actually shows — one entry point spreading to two Keycloak nodes.

The document now carries all 28 inline, one per claim that needed one, and
the section recording what was still missing is updated: the diagram gap is
closed, Studio records remain.

verify-pipeline.py passes. audit-records.py reports no issues.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
DongHyeonka
2026-09-05 11:03:10 +09:00
co-authored by Claude Opus 5
parent b2963105a8
commit 75bed382c8
286 changed files with 65385 additions and 710 deletions
@@ -0,0 +1,22 @@
# 백채널 로그아웃은 양쪽이 있어야 한다
## Alternative text
Keycloak 이 부를 주소와 앱이 받을 엔드포인트가 각각 비어 있어 로그아웃 통지가 어느 쪽에서도 성립하지 않는 구성.
## Long description
C-1 에서 로그아웃이 다른 앱으로 퍼지지 않는 것을 관측했고 원인은 단순했다. 두 클라이언트 모두 backchannelLogoutUrl 이 비어 있어 Keycloak 은 부를 주소를 몰랐고, BFF 소스에는 oidcLogout 설정이 없어 주소를 알려줘도 받을 곳이 없었다. Keycloak 파드에서 앱 URL 로 요청하면 200 이 돌아오므로 네트워크 문제도 아니다. 설정이 빠졌다와 기능이 없다는 다르게 고쳐야 하는데 여기는 둘 다였다.
## Elements and evidence
- **한 앱에서 로그아웃** (actor): Keycloak 세션이 끝난다. Evidence: L458L465.
- **backchannelLogoutUrl** (component): 클라이언트 설정. 비어 있었다. Evidence: L458L466.
- **앱의 수신 엔드포인트** (component): 소스에 없었다. Evidence: L458L466.
- **다른 앱의 세션** (component): 그대로 남는다. Evidence: L458L466.
## Relationships
- **backchannelLogoutUrl → 앱의 수신 엔드포인트:** 주소가 있어야 부른다. Evidence: L458L466.
- **앱의 수신 엔드포인트 → 다른 앱의 세션:** 받을 곳이 있어야 지운다. Evidence: L458L466.
- **한 앱에서 로그아웃 → backchannelLogoutUrl:** 통지할 주소를 찾는다. Evidence: L458L466.
@@ -0,0 +1,18 @@
# 백채널 로그아웃은 양쪽이 있어야 한다
# Question: IdP 쪽만 설정하면 로그아웃이 퍼지는가
direction: down
n0: "한 앱에서 로그아웃" {
shape: person
}
n1: "backchannelLogoutUrl" {
shape: rectangle
}
n2: "앱의 수신 엔드포인트" {
shape: rectangle
}
n3: "다른 앱의 세션" {
shape: rectangle
}
n0 -> n1: "통지할 주소를 찾는다"
n1 -> n2: "주소가 있어야 부른다"
n2 -> n3: "받을 곳이 있어야 지운다"
@@ -0,0 +1,12 @@
digraph techviz {
graph [rankdir=TB, splines=ortho, nodesep=0.55, ranksep=0.85];
node [fontname=Helvetica, fontsize=11, margin="0.18,0.12", style="rounded,filled", fillcolor=white, color="#2d4357", penwidth=1.5];
edge [fontname=Helvetica, fontsize=10, color="#364b5f", penwidth=1.4, arrowsize=0.75];
n0 [label="한 앱에서 로그아웃", shape=box, style="rounded,dashed,filled"];
n1 [label="backchannelLogoutUrl", shape=box, style="rounded,filled"];
n2 [label="앱의 수신 엔드포인트", shape=box, style="rounded,filled"];
n3 [label="다른 앱의 세션", shape=box, style="rounded,filled"];
n0 -> n1 [label="통지할 주소를 찾는다", style=solid];
n1 -> n2 [label="주소가 있어야 부른다", style=solid];
n2 -> n3 [label="받을 곳이 있어야 지운다", style=solid];
}
@@ -0,0 +1,38 @@
<?xml version="1.0" encoding="UTF-8"?>
<mxfile host="app.diagrams.net" modified="2026-07-23T00:00:00.000Z" agent="techviz-harness" version="24.7.17" type="device">
<diagram id="c2-backchannel-both-sides" name="백채널 로그아웃은 양쪽이 있어야 한다">
<mxGraphModel dx="680" dy="690" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="827" pageHeight="1169" math="0" shadow="0">
<root>
<mxCell id="0"/>
<mxCell id="1" parent="0"/>
<mxCell id="n_logout" value="한 앱에서 로그아웃" tooltip="Keycloak 세션이 끝난다. | Evidence: L458-L465" style="whiteSpace=wrap;html=1;rounded=1;strokeWidth=2;fontSize=14;fontStyle=1;fillColor=#ffffff;strokeColor=#2d4357;verticalAlign=middle;dashed=1;fillColor=#f5f7fa;strokeColor=#2563eb;strokeWidth=2;" vertex="1" parent="1">
<mxGeometry x="85.5" y="60.0" width="150.0" height="84.0" as="geometry"/>
</mxCell>
<mxCell id="n_kc-config" value="backchannelLogoutUrl&lt;br/&gt;Keycloak 은 부를 주소를 모른다" tooltip="클라이언트 설정. 비어 있었다. | Evidence: L458-L466" style="whiteSpace=wrap;html=1;rounded=1;strokeWidth=2;fontSize=14;fontStyle=1;fillColor=#ffffff;strokeColor=#2d4357;verticalAlign=middle;strokeColor=#d97706;fillColor=#fffdf5;" vertex="1" parent="1">
<mxGeometry x="70.0" y="240.0" width="181.0" height="71.0" as="geometry"/>
</mxCell>
<mxCell id="n_app-endpoint" value="앱의 수신 엔드포인트&lt;br/&gt;oidcLogout 설정 없음" tooltip="소스에 없었다. | Evidence: L458-L466" style="whiteSpace=wrap;html=1;rounded=1;strokeWidth=2;fontSize=14;fontStyle=1;fillColor=#ffffff;strokeColor=#2d4357;verticalAlign=middle;strokeColor=#d97706;fillColor=#fffdf5;" vertex="1" parent="1">
<mxGeometry x="85.5" y="407.0" width="150.0" height="71.0" as="geometry"/>
</mxCell>
<mxCell id="n_app-session" value="다른 앱의 세션&lt;br/&gt;네트워크는 200 으로 닿는다" tooltip="그대로 남는다. | Evidence: L458-L466" style="whiteSpace=wrap;html=1;rounded=1;strokeWidth=2;fontSize=14;fontStyle=1;fillColor=#ffffff;strokeColor=#2d4357;verticalAlign=middle;strokeColor=#d97706;fillColor=#fffdf5;" vertex="1" parent="1">
<mxGeometry x="85.5" y="574.0" width="150.0" height="71.0" as="geometry"/>
</mxCell>
<mxCell id="e_c-e" value="주소가 있어야 부른다" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;strokeWidth=2;endArrow=block;endFill=1;" edge="1" parent="1" source="n_kc-config" target="n_app-endpoint">
<mxGeometry relative="1" as="geometry">
<mxPoint x="184.5" y="359.0" as="offset"/>
</mxGeometry>
</mxCell>
<mxCell id="e_e-s" value="받을 곳이 있어야 지운다" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;strokeWidth=2;endArrow=block;endFill=1;" edge="1" parent="1" source="n_app-endpoint" target="n_app-session">
<mxGeometry relative="1" as="geometry">
<mxPoint x="184.5" y="526.0" as="offset"/>
</mxGeometry>
</mxCell>
<mxCell id="e_l-c" value="통지할 주소를 찾는다" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;strokeWidth=2;endArrow=block;endFill=1;" edge="1" parent="1" source="n_logout" target="n_kc-config">
<mxGeometry relative="1" as="geometry">
<mxPoint x="184.5" y="192.0" as="offset"/>
</mxGeometry>
</mxCell>
</root>
</mxGraphModel>
</diagram>
</mxfile>
@@ -0,0 +1,586 @@
{
"type": "excalidraw",
"version": 2,
"source": "techviz-harness",
"elements": [
{
"id": "edge-c-e",
"type": "arrow",
"x": 160.5,
"y": 311.0,
"width": 0.0,
"height": 96.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 2,
"strokeStyle": "solid",
"roughness": 1,
"opacity": 100,
"groupIds": [],
"frameId": null,
"index": null,
"roundness": null,
"seed": 1513220568,
"version": 1,
"versionNonce": 255748168,
"isDeleted": false,
"boundElements": [],
"updated": 0,
"link": null,
"locked": false,
"points": [
[
0.0,
0.0
],
[
0.0,
48.0
],
[
0.0,
48.0
],
[
0.0,
96.0
]
],
"lastCommittedPoint": null,
"startBinding": {
"elementId": "node-kc-config",
"focus": 0,
"gap": 4
},
"endBinding": {
"elementId": "node-app-endpoint",
"focus": 0,
"gap": 4
},
"startArrowhead": null,
"endArrowhead": "arrow",
"elbowed": true
},
{
"id": "edge-label-c-e",
"type": "text",
"x": 139.5,
"y": 347.0,
"width": 90,
"height": 24,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"strokeStyle": "solid",
"roughness": 0,
"opacity": 100,
"groupIds": [],
"frameId": null,
"index": null,
"roundness": {
"type": 3
},
"seed": 809267409,
"version": 1,
"versionNonce": 1101078427,
"isDeleted": false,
"boundElements": [],
"updated": 0,
"link": null,
"locked": false,
"fontSize": 13,
"fontFamily": 5,
"text": "주소가 있어야 부른다",
"textAlign": "center",
"verticalAlign": "middle",
"containerId": null,
"originalText": "주소가 있어야 부른다",
"autoResize": true,
"lineHeight": 1.25
},
{
"id": "edge-e-s",
"type": "arrow",
"x": 160.5,
"y": 478.0,
"width": 0.0,
"height": 96.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 2,
"strokeStyle": "solid",
"roughness": 1,
"opacity": 100,
"groupIds": [],
"frameId": null,
"index": null,
"roundness": null,
"seed": 1793841938,
"version": 1,
"versionNonce": 1078828844,
"isDeleted": false,
"boundElements": [],
"updated": 0,
"link": null,
"locked": false,
"points": [
[
0.0,
0.0
],
[
0.0,
48.0
],
[
0.0,
48.0
],
[
0.0,
96.0
]
],
"lastCommittedPoint": null,
"startBinding": {
"elementId": "node-app-endpoint",
"focus": 0,
"gap": 4
},
"endBinding": {
"elementId": "node-app-session",
"focus": 0,
"gap": 4
},
"startArrowhead": null,
"endArrowhead": "arrow",
"elbowed": true
},
{
"id": "edge-label-e-s",
"type": "text",
"x": 132.5,
"y": 514.0,
"width": 104,
"height": 24,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"strokeStyle": "solid",
"roughness": 0,
"opacity": 100,
"groupIds": [],
"frameId": null,
"index": null,
"roundness": {
"type": 3
},
"seed": 588860991,
"version": 1,
"versionNonce": 220268688,
"isDeleted": false,
"boundElements": [],
"updated": 0,
"link": null,
"locked": false,
"fontSize": 13,
"fontFamily": 5,
"text": "받을 곳이 있어야 지운다",
"textAlign": "center",
"verticalAlign": "middle",
"containerId": null,
"originalText": "받을 곳이 있어야 지운다",
"autoResize": true,
"lineHeight": 1.25
},
{
"id": "edge-l-c",
"type": "arrow",
"x": 160.5,
"y": 144.0,
"width": 0.0,
"height": 96.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 2,
"strokeStyle": "solid",
"roughness": 1,
"opacity": 100,
"groupIds": [],
"frameId": null,
"index": null,
"roundness": null,
"seed": 281015540,
"version": 1,
"versionNonce": 30036555,
"isDeleted": false,
"boundElements": [],
"updated": 0,
"link": null,
"locked": false,
"points": [
[
0.0,
0.0
],
[
0.0,
48.0
],
[
0.0,
48.0
],
[
0.0,
96.0
]
],
"lastCommittedPoint": null,
"startBinding": {
"elementId": "node-logout",
"focus": 0,
"gap": 4
},
"endBinding": {
"elementId": "node-kc-config",
"focus": 0,
"gap": 4
},
"startArrowhead": null,
"endArrowhead": "arrow",
"elbowed": true
},
{
"id": "edge-label-l-c",
"type": "text",
"x": 139.5,
"y": 180.0,
"width": 90,
"height": 24,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"strokeStyle": "solid",
"roughness": 0,
"opacity": 100,
"groupIds": [],
"frameId": null,
"index": null,
"roundness": {
"type": 3
},
"seed": 1891696490,
"version": 1,
"versionNonce": 410528482,
"isDeleted": false,
"boundElements": [],
"updated": 0,
"link": null,
"locked": false,
"fontSize": 13,
"fontFamily": 5,
"text": "통지할 주소를 찾는다",
"textAlign": "center",
"verticalAlign": "middle",
"containerId": null,
"originalText": "통지할 주소를 찾는다",
"autoResize": true,
"lineHeight": 1.25
},
{
"id": "node-logout",
"type": "rectangle",
"x": 85.5,
"y": 60.0,
"width": 150.0,
"height": 84.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "#ffffff",
"fillStyle": "solid",
"strokeWidth": 2,
"strokeStyle": "dashed",
"roughness": 1,
"opacity": 100,
"groupIds": [],
"frameId": null,
"index": null,
"roundness": {
"type": 3
},
"seed": 135793232,
"version": 1,
"versionNonce": 1679436838,
"isDeleted": false,
"boundElements": [],
"updated": 0,
"link": null,
"locked": false
},
{
"id": "node-label-logout",
"type": "text",
"x": 95.5,
"y": 70.0,
"width": 130.0,
"height": 64.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"strokeStyle": "solid",
"roughness": 0,
"opacity": 100,
"groupIds": [],
"frameId": null,
"index": null,
"roundness": {
"type": 3
},
"seed": 1938124211,
"version": 1,
"versionNonce": 1421660240,
"isDeleted": false,
"boundElements": [],
"updated": 0,
"link": null,
"locked": false,
"fontSize": 15,
"fontFamily": 5,
"text": "한 앱에서 로그아웃",
"textAlign": "center",
"verticalAlign": "middle",
"containerId": null,
"originalText": "한 앱에서 로그아웃",
"autoResize": true,
"lineHeight": 1.25
},
{
"id": "node-kc-config",
"type": "rectangle",
"x": 70.0,
"y": 240.0,
"width": 181.0,
"height": 71.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "#ffffff",
"fillStyle": "solid",
"strokeWidth": 2,
"strokeStyle": "solid",
"roughness": 1,
"opacity": 100,
"groupIds": [],
"frameId": null,
"index": null,
"roundness": {
"type": 3
},
"seed": 514639084,
"version": 1,
"versionNonce": 1749573177,
"isDeleted": false,
"boundElements": [],
"updated": 0,
"link": null,
"locked": false
},
{
"id": "node-label-kc-config",
"type": "text",
"x": 80.0,
"y": 250.0,
"width": 161.0,
"height": 51.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"strokeStyle": "solid",
"roughness": 0,
"opacity": 100,
"groupIds": [],
"frameId": null,
"index": null,
"roundness": {
"type": 3
},
"seed": 230474799,
"version": 1,
"versionNonce": 1719931632,
"isDeleted": false,
"boundElements": [],
"updated": 0,
"link": null,
"locked": false,
"fontSize": 15,
"fontFamily": 5,
"text": "backchannelLogoutUrl\nKeycloak 은 부를 주소를 모른다",
"textAlign": "center",
"verticalAlign": "middle",
"containerId": null,
"originalText": "backchannelLogoutUrl\nKeycloak 은 부를 주소를 모른다",
"autoResize": true,
"lineHeight": 1.25
},
{
"id": "node-app-endpoint",
"type": "rectangle",
"x": 85.5,
"y": 407.0,
"width": 150.0,
"height": 71.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "#ffffff",
"fillStyle": "solid",
"strokeWidth": 2,
"strokeStyle": "solid",
"roughness": 1,
"opacity": 100,
"groupIds": [],
"frameId": null,
"index": null,
"roundness": {
"type": 3
},
"seed": 153582198,
"version": 1,
"versionNonce": 1995435187,
"isDeleted": false,
"boundElements": [],
"updated": 0,
"link": null,
"locked": false
},
{
"id": "node-label-app-endpoint",
"type": "text",
"x": 95.5,
"y": 417.0,
"width": 130.0,
"height": 51.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"strokeStyle": "solid",
"roughness": 0,
"opacity": 100,
"groupIds": [],
"frameId": null,
"index": null,
"roundness": {
"type": 3
},
"seed": 268772163,
"version": 1,
"versionNonce": 304002942,
"isDeleted": false,
"boundElements": [],
"updated": 0,
"link": null,
"locked": false,
"fontSize": 15,
"fontFamily": 5,
"text": "앱의 수신 엔드포인트\noidcLogout 설정 없음",
"textAlign": "center",
"verticalAlign": "middle",
"containerId": null,
"originalText": "앱의 수신 엔드포인트\noidcLogout 설정 없음",
"autoResize": true,
"lineHeight": 1.25
},
{
"id": "node-app-session",
"type": "rectangle",
"x": 85.5,
"y": 574.0,
"width": 150.0,
"height": 71.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "#ffffff",
"fillStyle": "solid",
"strokeWidth": 2,
"strokeStyle": "solid",
"roughness": 1,
"opacity": 100,
"groupIds": [],
"frameId": null,
"index": null,
"roundness": {
"type": 3
},
"seed": 1710553737,
"version": 1,
"versionNonce": 1839332537,
"isDeleted": false,
"boundElements": [],
"updated": 0,
"link": null,
"locked": false
},
{
"id": "node-label-app-session",
"type": "text",
"x": 95.5,
"y": 584.0,
"width": 130.0,
"height": 51.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"strokeStyle": "solid",
"roughness": 0,
"opacity": 100,
"groupIds": [],
"frameId": null,
"index": null,
"roundness": {
"type": 3
},
"seed": 573778378,
"version": 1,
"versionNonce": 1579160282,
"isDeleted": false,
"boundElements": [],
"updated": 0,
"link": null,
"locked": false,
"fontSize": 15,
"fontFamily": 5,
"text": "다른 앱의 세션\n네트워크는 200 으로 닿는다",
"textAlign": "center",
"verticalAlign": "middle",
"containerId": null,
"originalText": "다른 앱의 세션\n네트워크는 200 으로 닿는다",
"autoResize": true,
"lineHeight": 1.25
}
],
"appState": {
"gridSize": 10,
"viewBackgroundColor": "#ffffff",
"currentItemFontFamily": 5
},
"files": {}
}
@@ -0,0 +1,32 @@
{
"harness_version": "0.2.0",
"spec_id": "c2-backchannel-both-sides",
"spec_version": "1.1",
"spec_sha256": "43396622cbf01d243efac1f48396163cc64738ef902bddda0ded0d9fb6467eb1",
"source_context": {
"document": "docs/keycloak-session-store/final/document.md",
"document_sha256": "1d44cba1905544d92f1d26ae36a8deb64a3db3914d6b488fd30d6ae7f8cfbabe",
"anchor": {
"kind": "heading",
"value": "C층 — SSO 와 로그아웃 전파",
"line": 464
}
},
"outputs": [
"c2-backchannel-both-sides.svg",
"c2-backchannel-both-sides.mmd",
"c2-backchannel-both-sides.d2",
"c2-backchannel-both-sides.dot",
"c2-backchannel-both-sides.drawio",
"c2-backchannel-both-sides.excalidraw",
"c2-backchannel-both-sides.alt.md"
],
"lint_issue_count": 0,
"assumption_count": 0,
"assumptions_allowed": false,
"composition_profile": "component-flow",
"reference_ids": [
"payment-event-flow"
],
"diagram_only": true
}
@@ -0,0 +1,12 @@
%% 백채널 로그아웃은 양쪽이 있어야 한다
%% question: IdP 쪽만 설정하면 로그아웃이 퍼지는가
flowchart TB
n0(["한 앱에서 로그아웃"])
n1["backchannelLogoutUrl"]
n2["앱의 수신 엔드포인트"]
n3["다른 앱의 세션"]
n0 -->|"통지할 주소를 찾는다"| n1
n1 -->|"주소가 있어야 부른다"| n2
n2 -->|"받을 곳이 있어야 지운다"| n3
classDef external stroke-dasharray: 6 4
class n0 external
@@ -0,0 +1,84 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="680" height="690" viewBox="0 0 680 690" role="img" aria-labelledby="diagram-title diagram-description">
<title id="diagram-title">백채널 로그아웃은 양쪽이 있어야 한다</title>
<desc id="diagram-description">C-1 에서 로그아웃이 다른 앱으로 퍼지지 않는 것을 관측했고 원인은 단순했다. 두 클라이언트 모두 backchannelLogoutUrl 이 비어 있어 Keycloak 은 부를 주소를 몰랐고, BFF 소스에는 oidcLogout 설정이 없어 주소를 알려줘도 받을 곳이 없었다. Keycloak 파드에서 앱 URL 로 요청하면 200 이 돌아오므로 네트워크 문제도 아니다. 설정이 빠졌다와 기능이 없다는 다르게 고쳐야 하는데 여기는 둘 다였다.</desc>
<metadata>{&quot;techviz&quot;:{&quot;spec_version&quot;:&quot;1.1&quot;,&quot;id&quot;:&quot;c2-backchannel-both-sides&quot;,&quot;profile&quot;:&quot;component-flow&quot;},&quot;source_context&quot;:{&quot;document&quot;:&quot;docs/keycloak-session-store/final/document.md&quot;,&quot;document_sha256&quot;:&quot;1d44cba1905544d92f1d26ae36a8deb64a3db3914d6b488fd30d6ae7f8cfbabe&quot;,&quot;anchor&quot;:{&quot;kind&quot;:&quot;heading&quot;,&quot;value&quot;:&quot;C층 — SSO 와 로그아웃 전파&quot;,&quot;line&quot;:464}},&quot;evidence_policy&quot;:&quot;Each factual element cites source lines or is marked assumption.&quot;,&quot;diagram_only&quot;: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="680" height="690" />
<polyline class="edge kind-blocked style-solid emphasis-normal" points="160.5,311.0 160.5,359.0 160.5,359.0 160.5,407.0" data-evidence="458-466" />
<rect class="edge-label-bg" x="138.7" y="345.0" width="91.7" height="22" rx="3" />
<text class="edge-label" x="184.5" y="360.0">주소가 있어야 부른다</text>
<polyline class="edge kind-blocked style-solid emphasis-normal" points="160.5,478.0 160.5,526.0 160.5,526.0 160.5,574.0" data-evidence="458-466" />
<rect class="edge-label-bg" x="131.9" y="512.0" width="105.1" height="22" rx="3" />
<text class="edge-label" x="184.5" y="527.0">받을 곳이 있어야 지운다</text>
<polyline class="edge kind-request style-solid emphasis-normal" points="160.5,144.0 160.5,192.0 160.5,192.0 160.5,240.0" data-evidence="458-466" />
<rect class="edge-label-bg" x="138.7" y="178.0" width="91.7" height="22" rx="3" />
<text class="edge-label" x="184.5" y="193.0">통지할 주소를 찾는다</text>
<g id="node-logout">
<g class="actor-symbol emphasis-primary" data-evidence="458-465"><circle cx="160.5" cy="80.0" r="11.0" /><line x1="160.5" y1="96.0" x2="160.5" y2="105.0" /><line x1="142.5" y1="106.0" x2="178.5" y2="106.0" /><line x1="160.5" y1="105.0" x2="145.5" y2="122.0" /><line x1="160.5" y1="105.0" x2="175.5" y2="122.0" /></g>
<text class="node-label" x="160.5" y="137.0">한 앱에서 로그아웃</text>
</g>
<g id="node-kc-config">
<rect class="node-shape kind-component emphasis-warning role-control" data-evidence="458-466" x="70.0" y="240.0" width="181.0" height="71.0" rx="7" />
<text class="node-label" x="160.5" y="267.0">backchannelLogoutUrl</text>
<line class="node-detail-divider" x1="84.0" y1="288.0" x2="237.0" y2="288.0" />
<text class="node-detail" x="86.0" y="305.0">Keycloak 은 부를 주소를 모른다</text>
</g>
<g id="node-app-endpoint">
<rect class="node-shape kind-component emphasis-warning role-control" data-evidence="458-466" x="85.5" y="407.0" width="150.0" height="71.0" rx="7" />
<text class="node-label" x="160.5" y="434.0">앱의 수신 엔드포인트</text>
<line class="node-detail-divider" x1="99.5" y1="455.0" x2="221.5" y2="455.0" />
<text class="node-detail" x="101.5" y="472.0">oidcLogout 설정 없음</text>
</g>
<g id="node-app-session">
<rect class="node-shape kind-component emphasis-warning role-target" data-evidence="458-466" x="85.5" y="574.0" width="150.0" height="71.0" rx="7" />
<text class="node-label" x="160.5" y="601.0">다른 앱의 세션</text>
<line class="node-detail-divider" x1="99.5" y1="622.0" x2="221.5" y2="622.0" />
<text class="node-detail" x="101.5" y="639.0">네트워크는 200 으로 닿는다</text>
</g>
</svg>

After

Width:  |  Height:  |  Size: 7.1 KiB