v1.12.21 관리자 미디어 조작 개선 및 CSP 관찰 안내 정리

pages/admin/index.vue

@@ -788,12 +788,12 @@ watch(trendRows, () => {
               CSP 관찰
             </h2>
             <p class="admin-dashboard__section-description mt-1 text-xs text-muted">
-              최근 {{ cspViolationSummary.days }}일 Report-Only 위반 상위 항목
+              최근 {{ cspViolationSummary.days }}일 내 보고된 항목 · 횟수는 최초 수집부터 누적
             </p>
           </div>
           <div class="admin-dashboard__csp-summary text-right text-xs text-muted">
             <p>
-              최근 {{ formatNumber(cspViolationSummary.recentViolations) }}회
+              최근 관찰 항목 누적 {{ formatNumber(cspViolationSummary.recentViolations) }}회
             </p>
             <p class="mt-1">
               전체 {{ formatNumber(cspViolationSummary.totalViolations) }}회 · 마지막 {{ formatDashboardDateTime(cspViolationSummary.latestSeenAt) }}
@@ -801,6 +801,19 @@ watch(trendRows, () => {
           </div>
         </div>
 
+        <div class="admin-dashboard__csp-explanation mt-4 rounded border border-line bg-paper p-3 text-xs leading-relaxed text-muted">
+          <p class="font-semibold text-ink">보안 정책을 강화하기 전, 사이트 기능과 충돌하는지 확인하는 관찰 기록입니다.</p>
+          <p class="mt-1">Report-Only는 차단 없이 보고만 수집합니다. 이 횟수가 공격 수나 실제 차단 수를 뜻하지는 않습니다.</p>
+          <details class="admin-dashboard__csp-help mt-2">
+            <summary class="cursor-pointer font-semibold text-ink">기록 해석과 관찰의 한계</summary>
+            <ul class="mt-2 list-disc space-y-1 pl-4">
+              <li>frame-src는 iframe 같은 삽입 화면에 관한 규칙입니다. empty는 보고에 출처가 없고, unknown은 출처를 식별하지 못했다는 뜻입니다. 이 값만으로 광고·확장 프로그램 등 원인을 확정할 수 없습니다.</li>
+              <li>현재 관찰 정책은 HTTPS 출처를 폭넓게 허용합니다. 보고가 없거나 허용 후보가 비어 있어도 모든 외부 출처를 확인한 것은 아닙니다.</li>
+              <li>최근 관찰 항목 누적은 최근 {{ cspViolationSummary.days }}일에 보고된 항목들의 전체 누적 합계입니다. 해당 기간에만 발생한 횟수는 현재 집계로 알 수 없습니다.</li>
+            </ul>
+          </details>
+        </div>
+
         <div
           v-if="cspAllowlistCandidates.length"
           class="admin-dashboard__csp-candidates mt-4 border border-line bg-paper p-3"
@@ -820,6 +833,9 @@ watch(trendRows, () => {
             </span>
           </div>
         </div>
+        <p v-else class="admin-dashboard__csp-no-candidates mt-3 text-xs text-muted">
+          조회한 상위 보고에서 외부 출처 허용 후보를 찾지 못했습니다. 이 결과만으로 차단 정책을 강화하지 않습니다.
+        </p>
 
         <div
           v-if="cspViolations.length"
@@ -832,7 +848,7 @@ watch(trendRows, () => {
                   지시어
                 </th>
                 <th class="whitespace-nowrap px-2 py-2 font-semibold">
-                  차단 출처
+                  보고된 출처
                 </th>
                 <th class="whitespace-nowrap px-2 py-2 font-semibold">
                   문서
@@ -841,7 +857,7 @@ watch(trendRows, () => {
                   브라우저
                 </th>
                 <th class="whitespace-nowrap px-2 py-2 text-right font-semibold">
-                  횟수
+                  누적 횟수
                 </th>
                 <th class="whitespace-nowrap px-2 py-2 text-right font-semibold">
                   최근
@@ -858,7 +874,7 @@ watch(trendRows, () => {
                   {{ row.effectiveDirective }}
                 </td>
                 <td class="max-w-[260px] truncate px-2 py-2 text-muted">
-                  {{ row.blockedOrigin }}
+                  {{ row.blockedOrigin === 'empty' ? '출처 없음 (empty)' : row.blockedOrigin === 'unknown' ? '식별 불가 (unknown)' : row.blockedOrigin }}
                 </td>
                 <td class="max-w-[240px] truncate px-2 py-2 text-muted">
                   {{ row.documentPath }}
@@ -880,7 +896,7 @@ watch(trendRows, () => {
           v-else
           class="admin-dashboard__csp-empty mt-4 border border-line bg-paper px-3 py-2 text-xs text-muted"
         >
-          최근 {{ cspViolationSummary.days }}일에 집계된 CSP 위반은 없습니다.
+          최근 {{ cspViolationSummary.days }}일에 보고된 CSP 관찰 항목은 없습니다.
         </p>
       </section>