feat: add auth and dual-stack tls management

public/file.js

@@ -7,6 +7,7 @@ import {
   linkToSource,
   optionalQueryParam
 } from './modules/common.js';
+import { bindLogoutButton, loadAuthState } from './modules/auth-client.js';
 import {
   loadClientSecrets,
   loadGlobalClientSecrets,
@@ -87,6 +88,8 @@ const previewThumbnailHintElement = document.querySelector('#previewThumbnailHin
 const thumbnailStatusElement = document.querySelector('#thumbnailStatus');
 const thumbnailPreviewElement = document.querySelector('#thumbnailPreview');
 const thumbnailCaptureCanvas = document.querySelector('#thumbnailCaptureCanvas');
+const authStatusElement = document.querySelector('#authStatus');
+const logoutButton = document.querySelector('#logoutButton');
 const viewPanels = [...document.querySelectorAll('[data-view-panel]')];
 const viewLinks = [...document.querySelectorAll('[data-view-link]')];
 
@@ -1277,6 +1280,11 @@ window.addEventListener('beforeunload', () => {
 async function bootstrap() {
   const initialView = normalizeView(window.location.hash.slice(1) || 'overview');
   setCurrentView(initialView, { replace: true });
+  const authentication = await loadAuthState();
+  authStatusElement.textContent = authentication.authenticated
+    ? `已登录：${authentication.username}`
+    : '未登录';
+  bindLogoutButton(logoutButton, authStatusElement);
 
   if (!state.sourceId || !state.fileId) {
     renderMissingRouteContext();