feat: Implement dynamic domain-based PWA manifest
- Added /manifest.webmanifest server-side route. - Implemented hostname-based branding lookup using Agent API Key. - Updated app.html to use the dynamic manifest route. - Added manifest verification tool to the System Testing dashboard.
This commit is contained in:
Scott Idem
@@ -1,75 +1,92 @@
|
||||
import { json } from '@sveltejs/kit';
|
||||
import { lookup_site_domain } from '$lib/ae_core/ae_core__site';
|
||||
import {
|
||||
PUBLIC_AE_API_PROTOCOL,
|
||||
PUBLIC_AE_API_SERVER,
|
||||
PUBLIC_AE_API_BAK_SERVER,
|
||||
PUBLIC_AE_API_PORT,
|
||||
PUBLIC_AE_API_PATH,
|
||||
PUBLIC_AE_API_SECRET_KEY,
|
||||
PUBLIC_AE_API_CRUD_SUPER_KEY,
|
||||
PUBLIC_AE_NO_ACCOUNT_ID
|
||||
} from '$env/static/public';
|
||||
import * as public_env from '$env/static/public';
|
||||
import type { RequestHandler } from './$types';
|
||||
|
||||
const api_base_url = `${PUBLIC_AE_API_PROTOCOL}://${PUBLIC_AE_API_SERVER}:${PUBLIC_AE_API_PORT}${PUBLIC_AE_API_PATH}`;
|
||||
const api_base_url_bak = `${PUBLIC_AE_API_PROTOCOL}://${PUBLIC_AE_API_BAK_SERVER}:${PUBLIC_AE_API_PORT}${PUBLIC_AE_API_PATH}`;
|
||||
|
||||
const api_init = {
|
||||
base_url: api_base_url,
|
||||
base_url_bak: api_base_url_bak,
|
||||
api_secret_key: PUBLIC_AE_API_SECRET_KEY,
|
||||
api_crud_super_key: PUBLIC_AE_API_CRUD_SUPER_KEY,
|
||||
headers: {
|
||||
'Access-Control-Allow-Origin': '*',
|
||||
'Content-Type': 'application/json',
|
||||
'x-aether-api-key': PUBLIC_AE_API_SECRET_KEY,
|
||||
'x-no-account-id': PUBLIC_AE_NO_ACCOUNT_ID
|
||||
}
|
||||
};
|
||||
|
||||
/** @type {import('./$types').RequestHandler} */
|
||||
export async function GET({ url, fetch }) {
|
||||
const fqdn = url.host;
|
||||
/**
|
||||
* Dynamic Web Manifest Generator
|
||||
* Generates PWA metadata based on the requesting domain.
|
||||
*/
|
||||
export const GET: RequestHandler = async ({ url, fetch }) => {
|
||||
const fqdn = url.hostname;
|
||||
|
||||
// Inject SvelteKit fetch for the lookup
|
||||
const api_cfg = { ...api_init, fetch };
|
||||
// Construct api_cfg from public env vars for the server-side lookup
|
||||
const protocol = public_env.PUBLIC_AE_API_PROTOCOL || 'https';
|
||||
const server = public_env.PUBLIC_AE_API_SERVER || 'api.oneskyit.com';
|
||||
const port = public_env.PUBLIC_AE_API_PORT || '443';
|
||||
const path = public_env.PUBLIC_AE_API_PATH || '';
|
||||
|
||||
const api_base_url = `${protocol}://${server}${port === '443' || port === '80' ? '' : ':' + port}${path}`;
|
||||
|
||||
const api_cfg = {
|
||||
base_url: api_base_url,
|
||||
headers: {
|
||||
'x-aether-api-key': public_env.PUBLIC_AE_API_SECRET_KEY,
|
||||
'x-no-account-id': public_env.PUBLIC_AE_NO_ACCOUNT_ID
|
||||
},
|
||||
fetch
|
||||
};
|
||||
|
||||
const site_domain = await lookup_site_domain({
|
||||
api_cfg,
|
||||
fqdn,
|
||||
log_lvl: 0
|
||||
});
|
||||
|
||||
if (!site_domain) {
|
||||
return json({ error: 'Site not found' }, { status: 404 });
|
||||
let site_domain = null;
|
||||
try {
|
||||
site_domain = await lookup_site_domain({
|
||||
api_cfg,
|
||||
fqdn,
|
||||
log_lvl: 0
|
||||
});
|
||||
} catch (e) {
|
||||
console.error(`PWA Manifest: Lookup failed for domain ${fqdn}:`, e);
|
||||
}
|
||||
|
||||
const site_name = site_domain.site_name || site_domain.account_name || 'Aether PWA';
|
||||
const short_name = site_domain.site_code || 'Aether';
|
||||
|
||||
// Use the site's header image or logo if available, otherwise fallback to default
|
||||
const icon_src = site_domain.header_image_path || '/favicon.png';
|
||||
// Default branding values
|
||||
let name = "Aether Platform";
|
||||
let short_name = "Aether";
|
||||
let background_color = "#1a1a1a";
|
||||
let theme_color = "#3a5997";
|
||||
let logo_url = "https://static.oneskyit.com/images/OSIT_logo_2022_192px.png";
|
||||
let logo_url_large = "https://static.oneskyit.com/images/OSIT_logo_2022_512px.png";
|
||||
|
||||
if (site_domain) {
|
||||
// Preference: Account Name > Site Name > Default
|
||||
name = site_domain.account_name || site_domain.site_name || name;
|
||||
short_name = site_domain.site_code || site_domain.account_code || short_name;
|
||||
|
||||
// If the site domain has a specific logo, we apply it here
|
||||
if (site_domain.header_image_path) {
|
||||
logo_url = site_domain.header_image_path;
|
||||
logo_url_large = site_domain.header_image_path;
|
||||
}
|
||||
}
|
||||
|
||||
const manifest = {
|
||||
name: `One Sky IT - ${site_name}`,
|
||||
name: name,
|
||||
short_name: short_name,
|
||||
description: `The Aether Progressive Web App for ${site_name}`,
|
||||
start_url: '/',
|
||||
display: 'fullscreen',
|
||||
background_color: 'hsl(220, 65%, 31%)',
|
||||
theme_color: 'hsl(220, 65%, 31%)',
|
||||
description: `The ${name} Progressive Web App`,
|
||||
start_url: "/",
|
||||
display: "standalone",
|
||||
background_color: background_color,
|
||||
theme_color: theme_color,
|
||||
icons: [
|
||||
{
|
||||
src: icon_src,
|
||||
sizes: 'any',
|
||||
type: 'image/png'
|
||||
src: logo_url,
|
||||
sizes: "192x192",
|
||||
type: "image/png",
|
||||
purpose: "any maskable"
|
||||
},
|
||||
{
|
||||
src: logo_url_large,
|
||||
sizes: "512x512",
|
||||
type: "image/png",
|
||||
purpose: "any maskable"
|
||||
}
|
||||
]
|
||||
],
|
||||
categories: ["business", "productivity"],
|
||||
orientation: "any"
|
||||
};
|
||||
|
||||
return json(manifest, {
|
||||
headers: {
|
||||
'Content-Type': 'application/manifest+json'
|
||||
'Cache-Control': 'public, max-age=3600' // Cache for 1 hour to reduce API load
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
@@ -168,6 +168,12 @@
|
||||
return 'Local cache cleared successfully';
|
||||
});
|
||||
|
||||
const test_manifest = () => run_test('PWA Manifest Lookup', async () => {
|
||||
const response = await fetch('/manifest.webmanifest');
|
||||
if (!response.ok) throw new Error(`HTTP ${response.status}: ${response.statusText}`);
|
||||
return await response.json();
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<!-- Outer wrapper to enable scrolling if parent is overflow-hidden -->
|
||||
@@ -381,16 +387,18 @@
|
||||
{/if}
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div class="card p-6 space-y-4 border border-gray-500 shadow-lg transition-all group hover:bg-surface-500/5">
|
||||
<header class="flex items-center gap-2 text-primary-500 border-b border-gray-500 pb-2">
|
||||
<Server size={20}/>
|
||||
<h4 class="h4 font-bold uppercase tracking-widest">Infrastructure</h4>
|
||||
</header>
|
||||
<button class="btn variant-filled-primary p-4 w-full shadow-md transition-all hover:scale-[1.02] flex items-center justify-center gap-2" onclick={test_site_domain_lookup} title="Test guest site domain lookup.">
|
||||
<Globe size={16}/> Site Domain Lookup
|
||||
</button>
|
||||
</div>
|
||||
<div class="card p-6 space-y-4 border border-gray-500 shadow-lg transition-all group hover:bg-surface-500/5">
|
||||
<div class="card p-6 space-y-4 border border-gray-500 shadow-lg transition-all group hover:bg-surface-500/5">
|
||||
<header class="flex items-center gap-2 text-primary-500 border-b border-gray-500 pb-2">
|
||||
<Server size={20}/>
|
||||
<h4 class="h4 font-bold uppercase tracking-widest">Infrastructure</h4>
|
||||
</header>
|
||||
<button class="btn variant-filled-primary p-4 w-full shadow-md transition-all hover:scale-[1.02] flex items-center justify-center gap-2" onclick={test_site_domain_lookup} title="Test guest site domain lookup.">
|
||||
<Globe size={16}/> Site Domain Lookup
|
||||
</button>
|
||||
<button class="btn variant-filled-primary p-4 w-full shadow-md transition-all hover:scale-[1.02] flex items-center justify-center gap-2" onclick={test_manifest} title="Verifies the dynamic PWA manifest returns correct branding for this domain.">
|
||||
<Code size={16}/> PWA Manifest Lookup
|
||||
</button>
|
||||
</div> <div class="card p-6 space-y-4 border border-gray-500 shadow-lg transition-all group hover:bg-surface-500/5">
|
||||
<header class="flex items-center gap-2 text-secondary-500 border-b border-gray-500 pb-2">
|
||||
<Database size={20}/>
|
||||
<h4 class="h4 font-bold uppercase tracking-widest">Core V3</h4>
|
||||
|
||||
Reference in New Issue
Block a user