fixes
This commit is contained in:
9390
app/package-lock.json
generated
Normal file
9390
app/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
@ -2,16 +2,18 @@
|
||||
<div class="page-wrapper">
|
||||
<Spinner :loading="loading" />
|
||||
<div v-html="output" />
|
||||
<div v-if="!loading">
|
||||
<div v-if="allowAccess" class="login-container">
|
||||
<form @submit.prevent="submitForm" class="login-form" autocomplete="on">
|
||||
<h2 class="title">Login</h2>
|
||||
<div v-if="!loading && status ==='starting'">
|
||||
<form name="loginForm" method="post" action="/login.php" @submit.prevent="submitForm" class="login-form" autocomplete="on">
|
||||
<input type="hidden" name="relocation" value="route=search/search&type=simple" />
|
||||
|
||||
<h2 class="title">Login</h2>
|
||||
|
||||
<div class="input-group">
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Username"
|
||||
v-model="username"
|
||||
name="username"
|
||||
required
|
||||
autocomplete="username"
|
||||
inputmode="email"
|
||||
@ -23,6 +25,7 @@
|
||||
type="password"
|
||||
placeholder="Password"
|
||||
v-model="password"
|
||||
name="password"
|
||||
required
|
||||
autocomplete="current-password"
|
||||
/>
|
||||
@ -35,17 +38,30 @@
|
||||
</button>
|
||||
<p v-if="captchaError" class="error-text">{{ captchaError }}</p>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div v-else class="login-container">
|
||||
<h2 class="title">Access Denied</h2>
|
||||
<p>You must access this page through the proper login flow.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="waiting-container">
|
||||
<h2>Container Status: {{ status }}</h2>
|
||||
<p v-if="status === 'running'">Waiting for services to be ready...</p>
|
||||
<p v-else-if="status === 'error'" class="error-text">{{ errorMessage }}</p>
|
||||
</div>
|
||||
<Spinner :loading="loading" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
definePageMeta({
|
||||
// This is an example of inline middleware
|
||||
middleware: async nuxtApp => {
|
||||
const host = useRequestURL().origin
|
||||
const res = await $fetch(host + '/api/status')
|
||||
if (res.status === 'ready') {
|
||||
navigateTo(host, { external: true })
|
||||
return false;
|
||||
}
|
||||
return true
|
||||
},
|
||||
})
|
||||
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { useRouter, useRoute } from 'vue-router'
|
||||
import Spinner from '@/components/Spinner.vue'
|
||||
@ -61,7 +77,10 @@ const captchaRef = ref(null)
|
||||
const captchaValue = ref('')
|
||||
const captchaError = ref('')
|
||||
const allowAccess = ref(false)
|
||||
const interval = ref(null)
|
||||
const status = ref('starting')
|
||||
|
||||
const POLL_MS = 5000
|
||||
const ALLOWED_REDIRECTS = new Set(['/', '/login', '/signin'])
|
||||
function sanitizeRedirect(raw) {
|
||||
if (typeof raw !== 'string') return '/login'
|
||||
@ -71,9 +90,39 @@ function sanitizeRedirect(raw) {
|
||||
return ALLOWED_REDIRECTS.has(pathOnly) ? raw : '/login'
|
||||
}
|
||||
|
||||
async function checkStatus () {
|
||||
try {
|
||||
const res = await $fetch(`${window.location.origin}/api/status`, {
|
||||
method: 'GET',
|
||||
cache: 'no-store'
|
||||
})
|
||||
status.value = res.status
|
||||
|
||||
if (res.status === 'ready') {
|
||||
if (interval.value) clearInterval(interval.value)
|
||||
loading.value = false
|
||||
if (username.value && password.value) {
|
||||
document.loginForm.submit()
|
||||
} else {
|
||||
navigateTo(window.location.origin + '/', { external: true })
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
loading.value = false
|
||||
status.value = 'error'
|
||||
errorMessage.value = error?.data?.message || 'Internal server error!'
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
allowAccess.value = true
|
||||
loading.value = false
|
||||
checkStatus()
|
||||
interval.value = setInterval(checkStatus, POLL_MS)
|
||||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
if (interval.value) clearInterval(interval.value)
|
||||
})
|
||||
|
||||
const submitForm = async () => {
|
||||
@ -81,42 +130,26 @@ const submitForm = async () => {
|
||||
output.value = ''
|
||||
captchaError.value = ''
|
||||
|
||||
// Read optional redirect from query but sanitize strictly
|
||||
const requested = sanitizeRedirect(String(route.query.redirect || '/login'))
|
||||
|
||||
try {
|
||||
// Optional CSRF token if you set one in a meta tag
|
||||
const csrf = document.querySelector('meta[name="csrf-token"]')?.content
|
||||
|
||||
const res = await $fetch(`${window.location.origin}/api/login`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
...(csrf ? { 'X-CSRF-Token': csrf } : {})
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
credentials: 'include',
|
||||
body: {
|
||||
username: username.value,
|
||||
password: password.value,
|
||||
source: 'login',
|
||||
panswer: captchaValue.value,
|
||||
redirect: requested
|
||||
panswer: captchaValue.value
|
||||
},
|
||||
throwHttpErrors: false
|
||||
})
|
||||
|
||||
if (res?.status === 'success' && res?.redirect) {
|
||||
router.push(res.redirect) // e.g. /waiting?name=...&handoff=...&path=/login
|
||||
} else {
|
||||
if (res?.status !== 'success') {
|
||||
captchaError.value = res?.message || 'Login failed'
|
||||
loading.value = false
|
||||
}
|
||||
} catch (error) {
|
||||
captchaError.value = error?.data?.message || 'Internal server error!'
|
||||
loading.value = false
|
||||
} finally {
|
||||
loading.value = false
|
||||
// scrub sensitive inputs
|
||||
password.value = ''
|
||||
captchaRef.value?.refreshCaptcha()
|
||||
captchaValue.value = ''
|
||||
}
|
||||
@ -163,5 +196,14 @@ const submitForm = async () => {
|
||||
border-color: #3b82f6;
|
||||
box-shadow: 0 0 0 2px rgba(59,130,246,.3);
|
||||
}
|
||||
.waiting-container {
|
||||
max-width: 100%;
|
||||
width: 400px;
|
||||
margin: 5rem auto;
|
||||
padding: 2rem;
|
||||
border-radius: 8px;
|
||||
background: #f9fafb;
|
||||
box-shadow: 0 4px 10px rgb(0 0 0 / 0.1);
|
||||
}
|
||||
.error-text { color: #b91c1c; margin-top: .5rem; }
|
||||
</style>
|
||||
@ -1,112 +0,0 @@
|
||||
<template>
|
||||
<div class="page-wrapper">
|
||||
<div class="waiting-container">
|
||||
<h2>Container Status: {{ status }}</h2>
|
||||
<p v-if="status === 'ready'">
|
||||
Your container is ready! <a :href="openLink" target="_blank" rel="noopener">Open it</a>
|
||||
</p>
|
||||
<p v-else-if="status === 'running'">Waiting for services to be ready...</p>
|
||||
<p v-else-if="status === 'starting'">Starting container...</p>
|
||||
<p v-else-if="status === 'error'" class="error-text">{{ errorMessage }}</p>
|
||||
</div>
|
||||
<Spinner :loading="loading" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted, onUnmounted, computed } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
|
||||
const name = String(route.query.name || '')
|
||||
const handoff = typeof route.query.handoff === 'string' ? route.query.handoff : ''
|
||||
const rawPath = typeof route.query.path === 'string' ? route.query.path : '/login'
|
||||
|
||||
function sanitizePath(p) {
|
||||
if (typeof p !== 'string') return '/login'
|
||||
if (p.startsWith('http://') || p.startsWith('https://')) return '/login'
|
||||
if (!p.startsWith('/')) return '/login'
|
||||
const allowed = new Set(['/', '/login', '/signin'])
|
||||
const pathOnly = p.split('?')[0]
|
||||
return allowed.has(pathOnly) ? p : '/login'
|
||||
}
|
||||
const safePath = sanitizePath(rawPath)
|
||||
|
||||
const loading = ref(true)
|
||||
const status = ref('starting')
|
||||
const ip = ref(null)
|
||||
const interval = ref(null)
|
||||
const errorMessage = ref(null)
|
||||
|
||||
const POLL_MS = 5000
|
||||
|
||||
const openLink = computed(() => (ip.value ? `http://${ip.value}` : '#'))
|
||||
|
||||
async function checkStatus () {
|
||||
try {
|
||||
const res = await $fetch(`${window.location.origin}/api/status?name=${encodeURIComponent(name)}`, {
|
||||
method: 'GET',
|
||||
cache: 'no-store'
|
||||
})
|
||||
|
||||
status.value = res.status
|
||||
if (res.ip) ip.value = res.ip
|
||||
|
||||
if (res.status === 'ready') {
|
||||
if (interval.value) clearInterval(interval.value)
|
||||
loading.value = false
|
||||
|
||||
// Prefer bridge handoff if we have an id; otherwise, just open container root.
|
||||
if (handoff) {
|
||||
const bridge = new URL(`${window.location.origin}/api/handoff/post`)
|
||||
bridge.searchParams.set('name', name)
|
||||
bridge.searchParams.set('handoff', handoff)
|
||||
bridge.searchParams.set('path', safePath)
|
||||
// Replace to avoid creating a back entry with sensitive navigation
|
||||
window.location.replace(bridge.toString())
|
||||
} else if (ip.value) {
|
||||
window.location.replace(`http://${ip.value}`)
|
||||
} else {
|
||||
window.location.replace(`http://${window.location.host}`)
|
||||
}
|
||||
} else {
|
||||
loading.value = true
|
||||
}
|
||||
} catch (error) {
|
||||
loading.value = false
|
||||
status.value = 'error'
|
||||
errorMessage.value = error?.data?.message || 'Internal server error!'
|
||||
|
||||
if (interval.value) clearInterval(interval.value)
|
||||
|
||||
// Bounce back to app without leaking anything sensitive
|
||||
setTimeout(() => {
|
||||
router.replace(`/app/`)
|
||||
}, 5000)
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
checkStatus()
|
||||
interval.value = setInterval(checkStatus, POLL_MS)
|
||||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
if (interval.value) clearInterval(interval.value)
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.waiting-container {
|
||||
max-width: 100%;
|
||||
width: 400px;
|
||||
margin: 5rem auto;
|
||||
padding: 2rem;
|
||||
border-radius: 8px;
|
||||
background: #f9fafb;
|
||||
box-shadow: 0 4px 10px rgb(0 0 0 / 0.1);
|
||||
}
|
||||
.error-text { color: #b91c1c; }
|
||||
</style>
|
||||
Reference in New Issue
Block a user