mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-20 06:20:11 +00:00
d621102d68
Fixes two related issues with the auth service worker: 1. Opaqueredirect network error: - Service workers cannot return opaqueredirect responses to the page - When using redirect: 'manual', cross-origin redirects produce opaqueredirect - Solution: Re-fetch with redirect: 'follow' when opaqueredirect detected - Browser automatically strips auth headers on cross-origin redirects to GCS 2. Race condition on first load: - App was mounting before service worker registration completed - Images could load before SW gained control of the page - Solution: Await SW registration before mounting app - Changed void import() to await import() at all levels This fixes the pattern where hard refresh works (bypasses SW) but normal refresh fails (SW intercepts but returns invalid opaqueredirect response).
92 lines
2.5 KiB
TypeScript
92 lines
2.5 KiB
TypeScript
import { definePreset } from '@primevue/themes'
|
|
import Aura from '@primevue/themes/aura'
|
|
import * as Sentry from '@sentry/vue'
|
|
import { initializeApp } from 'firebase/app'
|
|
import { createPinia } from 'pinia'
|
|
import 'primeicons/primeicons.css'
|
|
import PrimeVue from 'primevue/config'
|
|
import ConfirmationService from 'primevue/confirmationservice'
|
|
import ToastService from 'primevue/toastservice'
|
|
import Tooltip from 'primevue/tooltip'
|
|
import { createApp } from 'vue'
|
|
import { VueFire, VueFireAuth } from 'vuefire'
|
|
|
|
import { FIREBASE_CONFIG } from '@/config/firebase'
|
|
import '@/lib/litegraph/public/css/litegraph.css'
|
|
import router from '@/router'
|
|
|
|
import App from './App.vue'
|
|
// Intentionally relative import to ensure the CSS is loaded in the right order (after litegraph.css)
|
|
import './assets/css/style.css'
|
|
import { i18n } from './i18n'
|
|
|
|
/**
|
|
* CRITICAL: Load remote config FIRST for cloud builds to ensure
|
|
* window.__CONFIG__is available for all modules during initialization
|
|
*/
|
|
import { isCloud } from '@/platform/distribution/types'
|
|
|
|
if (isCloud) {
|
|
const { loadRemoteConfig } = await import(
|
|
'@/platform/remoteConfig/remoteConfig'
|
|
)
|
|
await loadRemoteConfig()
|
|
}
|
|
|
|
const ComfyUIPreset = definePreset(Aura, {
|
|
semantic: {
|
|
// @ts-expect-error fixme ts strict error
|
|
primary: Aura['primitive'].blue
|
|
}
|
|
})
|
|
|
|
const firebaseApp = initializeApp(FIREBASE_CONFIG)
|
|
|
|
const app = createApp(App)
|
|
const pinia = createPinia()
|
|
Sentry.init({
|
|
app,
|
|
dsn: __SENTRY_DSN__,
|
|
enabled: __SENTRY_ENABLED__,
|
|
release: __COMFYUI_FRONTEND_VERSION__,
|
|
integrations: [],
|
|
autoSessionTracking: false,
|
|
defaultIntegrations: false,
|
|
normalizeDepth: 8,
|
|
tracesSampleRate: 0
|
|
})
|
|
app.directive('tooltip', Tooltip)
|
|
app
|
|
.use(router)
|
|
.use(PrimeVue, {
|
|
theme: {
|
|
preset: ComfyUIPreset,
|
|
options: {
|
|
prefix: 'p',
|
|
cssLayer: {
|
|
name: 'primevue',
|
|
order: 'theme, base, primevue'
|
|
},
|
|
// This is a workaround for the issue with the dark mode selector
|
|
// https://github.com/primefaces/primevue/issues/5515
|
|
darkModeSelector: '.dark-theme, :root:has(.dark-theme)'
|
|
}
|
|
}
|
|
})
|
|
.use(ConfirmationService)
|
|
.use(ToastService)
|
|
.use(pinia)
|
|
.use(i18n)
|
|
.use(VueFire, {
|
|
firebaseApp,
|
|
modules: [VueFireAuth()]
|
|
})
|
|
|
|
// Register auth service worker after Pinia is initialized (cloud-only)
|
|
// Wait for registration to complete before mounting to ensure SW controls the page
|
|
if (isCloud) {
|
|
await import('@/platform/auth/serviceWorker')
|
|
}
|
|
|
|
app.mount('#vue-app')
|