djb-eapim/eapim-portal
1
0
Fork 0
Code Issues Pull Requests Actions 6 Packages Projects Releases Wiki Activity

- OAuth2 가이드 scope 고정값 "api" 반영(master 이식)

Browse Source 
- 인증 헤더 표기 X-AUTH-TOKEN 으로 수정
- 가이드 히어로/사전준비/엔드포인트 1열 배치 전환
- webhook 개발가이드 문구 정리, SASS 재컴파일

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Rinjae
2026-07-23 18:07:58 +09:00
parent 4a3b5b43f3
commit a2813f391c
5 changed files with 41 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/resources/static/css/main.css
+11 -6
View File
@@ -23166,14 +23166,16 @@ input[type=checkbox]:checked + .custom-checkbox {
max-width: 1240px; max-width: 1240px;
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
gap: 138px; text-align: center;
gap: 30px;
padding: 0 37px; padding: 0 37px;
} }
.oauth2-2legged__hero-body { .oauth2-2legged__hero-body {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: center;
gap: 15px; gap: 15px;
} }
.oauth2-2legged__hero-eyebrow { .oauth2-2legged__hero-eyebrow {
@@ -23253,7 +23255,7 @@ input[type=checkbox]:checked + .custom-checkbox {
} }
.oauth2-2legged__prereq-grid { .oauth2-2legged__prereq-grid {
display: grid; display: grid;
grid-template-columns: 1fr 1fr 1fr; grid-template-columns: 1fr;
gap: 16px; gap: 16px;
} }
.oauth2-2legged__prereq-card { .oauth2-2legged__prereq-card {
@@ -23317,15 +23319,18 @@ input[type=checkbox]:checked + .custom-checkbox {
} }
.oauth2-2legged__endpoint-box { .oauth2-2legged__endpoint-box {
display: grid; display: grid;
grid-template-columns: auto 1fr auto; grid-template-columns: 1fr;
align-items: center; gap: 8px;
gap: 16px;
padding: 16px 24px; padding: 16px 24px;
margin-bottom: 20px; margin-bottom: 20px;
background: #FFFFFF; background: #FFFFFF;
border: 1px solid #E2E8F0; border: 1px solid #E2E8F0;
border-radius: 12px; border-radius: 12px;
} }
.oauth2-2legged__endpoint-box .oauth2-2legged__method,
.oauth2-2legged__endpoint-box .oauth2-2legged__endpoint-content-type {
justify-self: start;
}
.oauth2-2legged__method { .oauth2-2legged__method {
display: inline-block; display: inline-block;
padding: 5px 14px; padding: 5px 14px;
src/main/resources/static/css/main.css.map
+1 -1
View File
File diff suppressed because one or more lines are too long
src/main/resources/static/sass/pages/_service.scss
+13 -6
View File
@@ -904,19 +904,22 @@ $o2leg-err-fg: #a23b3b;
margin-top: 40px; margin-top: 40px;
} }
// 가이드 본문 컬럼이 좁아 2열 배치가 깨짐 → 모든 블럭 1열(세로 스택) 고정
&__hero-inner { &__hero-inner {
max-width: 1240px; max-width: 1240px;
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
gap: 138px; text-align: center;
gap: 30px;
padding: 0 37px; padding: 0 37px;
} }
&__hero-body { &__hero-body {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: center;
gap: 15px; gap: 15px;
} }
@@ -1008,7 +1011,7 @@ $o2leg-err-fg: #a23b3b;
// -- Section 2: 사전 준비 ---------------------------------------------------- // -- Section 2: 사전 준비 ----------------------------------------------------
&__prereq-grid { &__prereq-grid {
display: grid; display: grid;
grid-template-columns: 1fr 1fr 1fr; grid-template-columns: 1fr;
gap: 16px; gap: 16px;
} }
@@ -1083,14 +1086,18 @@ $o2leg-err-fg: #a23b3b;
&__endpoint-box { &__endpoint-box {
display: grid; display: grid;
grid-template-columns: auto 1fr auto; grid-template-columns: 1fr;
align-items: center; gap: 8px;
gap: 16px;
padding: 16px 24px; padding: 16px 24px;
margin-bottom: 20px; margin-bottom: 20px;
background: #FFFFFF; background: #FFFFFF;
border: 1px solid $o2leg-border; border: 1px solid $o2leg-border;
border-radius: 12px; border-radius: 12px;
.oauth2-2legged__method,
.oauth2-2legged__endpoint-content-type {
justify-self: start;
}
} }
&__method { &__method {
src/main/resources/templates/views/apps/service/oauth2-guide.html
+12 -13
View File
@@ -92,7 +92,7 @@
<span class="oauth2-2legged__prereq-num">3</span> <span class="oauth2-2legged__prereq-num">3</span>
<div class="oauth2-2legged__prereq-body"> <div class="oauth2-2legged__prereq-body">
<h3 class="oauth2-2legged__prereq-title">Scope 확인</h3> <h3 class="oauth2-2legged__prereq-title">Scope 확인</h3>
<p>호출하려는 API에 필요한 scope</p> <p>scope 는 고정값 "api" 사용</p>
<p>권한이 부여됐는지 확인합니다.</p> <p>권한이 부여됐는지 확인합니다.</p>
</div> </div>
</article> </article>
@@ -136,7 +136,7 @@
<text x="560" y="102" text-anchor="middle" font-size="12" font-weight="700" <text x="560" y="102" text-anchor="middle" font-size="12" font-weight="700"
fill="#0049b4">① POST /dj/oauth/token</text> fill="#0049b4">① POST /dj/oauth/token</text>
<text x="560" y="118" text-anchor="middle" font-size="11" font-weight="500" <text x="560" y="118" text-anchor="middle" font-size="11" font-weight="500"
fill="#64748B">grant_type=client_credentials, client_id, client_secret, scope</text> fill="#64748B">grant_type=client_credentials, client_id, client_secret, scope=api</text>
<line x1="240" y1="128" x2="880" y2="128" stroke="#0049b4" stroke-width="2" <line x1="240" y1="128" x2="880" y2="128" stroke="#0049b4" stroke-width="2"
marker-end="url(#o2leg-arrow-primary)" /> marker-end="url(#o2leg-arrow-primary)" />
@@ -145,11 +145,11 @@
<line x1="880" y1="170" x2="240" y2="170" stroke="#64748B" stroke-width="2" <line x1="880" y1="170" x2="240" y2="170" stroke="#64748B" stroke-width="2"
marker-end="url(#o2leg-arrow-gray)" /> marker-end="url(#o2leg-arrow-gray)" />
<text x="560" y="188" text-anchor="middle" font-size="11" font-weight="500" <text x="560" y="188" text-anchor="middle" font-size="11" font-weight="500"
fill="#64748B">{ access_token, token_type:"bearer", expires_in:86400, scope, jti fill="#64748B">{ access_token, token_type:"bearer", expires_in:86400, scope:"api", jti
}</text> }</text>
<text x="560" y="216" text-anchor="middle" font-size="12" font-weight="700" <text x="560" y="216" text-anchor="middle" font-size="12" font-weight="700"
fill="#0049b4">③ GET /api/v1/... · Authorization: Bearer &lt;access_token&gt;</text> fill="#0049b4">③ GET /api/v1/... · X-AUTH-TOKEN: Bearer &lt;access_token&gt;</text>
<line x1="240" y1="226" x2="880" y2="226" stroke="#0049b4" stroke-width="2" <line x1="240" y1="226" x2="880" y2="226" stroke="#0049b4" stroke-width="2"
marker-end="url(#o2leg-arrow-primary)" /> marker-end="url(#o2leg-arrow-primary)" />
@@ -210,9 +210,9 @@
<tr> <tr>
<td><code>scope</code></td> <td><code>scope</code></td>
<td><span <td><span
class="oauth2-2legged__req-badge oauth2-2legged__req-badge--optional">선택</span> class="oauth2-2legged__req-badge oauth2-2legged__req-badge--required">필수</span>
</td> </td>
<td>호출 권한 범위 (공백 구분)</td> <td>고정값 "api"</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
@@ -228,7 +228,7 @@ curl -X <span class="o2leg-y">POST</span> <span class="o2leg-c">'https://openapi
-d <span class="o2leg-c">'grant_type=client_credentials'</span> \ -d <span class="o2leg-c">'grant_type=client_credentials'</span> \
-d <span class="o2leg-c">'client_id=YOUR_CLIENT_ID'</span> \ -d <span class="o2leg-c">'client_id=YOUR_CLIENT_ID'</span> \
-d <span class="o2leg-c">'client_secret=YOUR_CLIENT_SECRET'</span> \ -d <span class="o2leg-c">'client_secret=YOUR_CLIENT_SECRET'</span> \
-d <span class="o2leg-c">'scope=read.accounts'</span> -d <span class="o2leg-c">'scope=api'</span>
<span class="o2leg-g"># 응답: 200 OK + JSON</span></pre> <span class="o2leg-g"># 응답: 200 OK + JSON</span></pre>
</div> </div>
@@ -248,7 +248,7 @@ curl -X <span class="o2leg-y">POST</span> <span class="o2leg-c">'https://openapi
<span class="o2leg-c">"access_token"</span>: <span class="o2leg-y">"eyJhbGciOiJSUzI1NiJ9..."</span>, <span class="o2leg-c">"access_token"</span>: <span class="o2leg-y">"eyJhbGciOiJSUzI1NiJ9..."</span>,
<span class="o2leg-c">"token_type"</span>: <span class="o2leg-y">"bearer"</span>, <span class="o2leg-c">"token_type"</span>: <span class="o2leg-y">"bearer"</span>,
<span class="o2leg-c">"expires_in"</span>: <span class="o2leg-p">86400</span>, <span class="o2leg-c">"expires_in"</span>: <span class="o2leg-p">86400</span>,
<span class="o2leg-c">"scope"</span>: <span class="o2leg-y">"read.accounts"</span>, <span class="o2leg-c">"scope"</span>: <span class="o2leg-y">"api"</span>,
<span class="o2leg-c">"jti"</span>: <span class="o2leg-y">"f47ac10b-58cc-4372-..."</span> <span class="o2leg-c">"jti"</span>: <span class="o2leg-y">"f47ac10b-58cc-4372-..."</span>
} }
@@ -284,7 +284,7 @@ curl -X <span class="o2leg-y">POST</span> <span class="o2leg-c">'https://openapi
<tr> <tr>
<td><code class="oauth2-2legged__field-name">scope</code></td> <td><code class="oauth2-2legged__field-name">scope</code></td>
<td>string</td> <td>string</td>
<td>실제 부여된 권한 범위</td> <td>부여된 권한 범위 (api)</td>
</tr> </tr>
<tr> <tr>
<td><code class="oauth2-2legged__field-name">jti</code></td> <td><code class="oauth2-2legged__field-name">jti</code></td>
@@ -301,13 +301,13 @@ curl -X <span class="o2leg-y">POST</span> <span class="o2leg-c">'https://openapi
<section class="oauth2-2legged__step" aria-labelledby="o2leg-step3-title"> <section class="oauth2-2legged__step" aria-labelledby="o2leg-step3-title">
<span class="oauth2-2legged__eyebrow">STEP 3</span> <span class="oauth2-2legged__eyebrow">STEP 3</span>
<h2 class="oauth2-2legged__h2" id="o2leg-step3-title">발급 토큰으로 API 호출</h2> <h2 class="oauth2-2legged__h2" id="o2leg-step3-title">발급 토큰으로 API 호출</h2>
<p class="oauth2-2legged__desc">Authorization 헤더에 Bearer 토큰을 실어 보호 자원 API 를 호출합니다.</p> <p class="oauth2-2legged__desc">X-AUTH-TOKEN 헤더에 Bearer 토큰을 실어 보호 자원 API 를 호출합니다.</p>
<div class="oauth2-2legged__step-grid"> <div class="oauth2-2legged__step-grid">
<div class="oauth2-2legged__panel"> <div class="oauth2-2legged__panel">
<h3 class="oauth2-2legged__panel-title">필수 헤더</h3> <h3 class="oauth2-2legged__panel-title">필수 헤더</h3>
<div class="oauth2-2legged__header-box"> <div class="oauth2-2legged__header-box">
<code class="oauth2-2legged__header-key">Authorization:</code> <code class="oauth2-2legged__header-key">X-AUTH-TOKEN:</code>
<code class="oauth2-2legged__header-value">Bearer eyJhbGciOiJSUzI1NiJ9...</code> <code class="oauth2-2legged__header-value">Bearer eyJhbGciOiJSUzI1NiJ9...</code>
</div> </div>
@@ -316,7 +316,6 @@ curl -X <span class="o2leg-y">POST</span> <span class="o2leg-c">'https://openapi
<li>동일 토큰은 expires_in(기본 86400초) 동안 재사용</li> <li>동일 토큰은 expires_in(기본 86400초) 동안 재사용</li>
<li>만료 임박 시 재발급 후 교체 (예: TTL의 80% 시점)</li> <li>만료 임박 시 재발급 후 교체 (예: TTL의 80% 시점)</li>
<li>매 호출마다 토큰을 새로 발급하지 마세요</li> <li>매 호출마다 토큰을 새로 발급하지 마세요</li>
<li>권한이 다른 API 는 scope 별로 토큰을 분리 발급</li>
</ul> </ul>
</div> </div>
@@ -325,7 +324,7 @@ curl -X <span class="o2leg-y">POST</span> <span class="o2leg-c">'https://openapi
<pre class="oauth2-2legged__code-block"><span class="o2leg-cm"># 보호 자원 API 호출</span> <pre class="oauth2-2legged__code-block"><span class="o2leg-cm"># 보호 자원 API 호출</span>
curl -X <span class="o2leg-y">GET</span> \ curl -X <span class="o2leg-y">GET</span> \
<span class="o2leg-c">'https://openapi.djbank.co.kr/api/v1/accounts'</span> \ <span class="o2leg-c">'https://openapi.djbank.co.kr/api/v1/accounts'</span> \
-H <span class="o2leg-c">'Authorization: Bearer eyJhbGciOiJSUzI..'</span> \ -H <span class="o2leg-c">'X-AUTH-TOKEN: Bearer eyJhbGciOiJSUzI..'</span> \
-H <span class="o2leg-c">'Accept: application/json'</span> -H <span class="o2leg-c">'Accept: application/json'</span>
<span class="o2leg-g"># 응답</span> <span class="o2leg-g"># 응답</span>
src/main/resources/templates/views/apps/service/webhook-dev-guide.html
+3 -3
View File
@@ -351,12 +351,12 @@ valid = constantTimeEquals(received, expected)</pre>
<tr> <tr>
<td><code>400</code></td> <td><code>400</code></td>
<td>필수 헤더 누락</td> <td>필수 헤더 누락</td>
<td>실패 기록 + 재시도</td> <td>실패 기록</td>
</tr> </tr>
<tr> <tr>
<td><code>401</code></td> <td><code>401</code></td>
<td>서명 불일치 / timestamp 만료</td> <td>서명 불일치 / timestamp 만료</td>
<td>실패 기록 + 재시도</td> <td>실패 기록</td>
</tr> </tr>
<tr> <tr>
<td><code>5xx</code> · 타임아웃</td> <td><code>5xx</code> · 타임아웃</td>
@@ -365,7 +365,7 @@ valid = constantTimeEquals(received, expected)</pre>
</tr> </tr>
</tbody> </tbody>
</table> </table>
<p class="oauth2-2legged__warning">⚠ 2xx 이외 응답과 네트워크 오류는 <strong>일정 간격을 두고 재시도</strong>됩니다(기본 3회). 재시도로 인한 중복 수신은 <code>eventId</code> 멱등 처리로 방어하세요.</p> <p class="oauth2-2legged__warning">⚠ 5xx 응답·타임아웃과 네트워크 오류는 <strong>일정 간격을 두고 재시도</strong>됩니다(기본 3회). 재시도로 인한 중복 수신은 <code>eventId</code> 멱등 처리로 방어하세요.</p>
<h4 class="oauth2-2legged__panel-subtitle">응답 가이드</h4> <h4 class="oauth2-2legged__panel-subtitle">응답 가이드</h4>
<ul class="oauth2-2legged__tips"> <ul class="oauth2-2legged__tips">