fix: favicon, apple touch icon, etc not loaded from CDN

This commit is contained in:
Tom Moor
2023-03-11 14:10:13 -05:00
parent af0485fa12
commit 3eabb30949
2 changed files with 22 additions and 25 deletions

View File

@@ -65,7 +65,9 @@ export const renderApp = async (
const { shareId } = ctx.params; const { shareId } = ctx.params;
const page = await readIndexFile(); const page = await readIndexFile();
const environment = ` const environment = `
window.env = ${JSON.stringify(presentEnv(env, options.analytics))}; <script>
window.env = ${JSON.stringify(presentEnv(env, options.analytics))};
</script>
`; `;
const entry = "app/index.tsx"; const entry = "app/index.tsx";
const scriptTags = isProduction const scriptTags = isProduction
@@ -85,13 +87,14 @@ export const renderApp = async (
ctx.body = page ctx.body = page
.toString() .toString()
.replace(/\/\/inject-env\/\//g, environment) .replace(/\{env\}/g, environment)
.replace(/\/\/inject-title\/\//g, escape(title)) .replace(/\{title\}/g, escape(title))
.replace(/\/\/inject-description\/\//g, escape(description)) .replace(/\{description\}/g, escape(description))
.replace(/\/\/inject-canonical\/\//g, canonical) .replace(/\{canonical-url\}/g, canonical)
.replace(/\/\/inject-prefetch\/\//g, shareId ? "" : prefetchTags) .replace(/\{prefetch\}/g, shareId ? "" : prefetchTags)
.replace(/\/\/inject-slack-app-id\/\//g, env.SLACK_APP_ID || "") .replace(/\{slack-app-id\}/g, env.SLACK_APP_ID || "")
.replace(/\/\/inject-script-tags\/\//g, scriptTags); .replace(/\{cdn-url\}/g, env.CDN_URL || "")
.replace(/\{script-tags\}/g, scriptTags);
}; };
export const renderShare = async (ctx: Context, next: Next) => { export const renderShare = async (ctx: Context, next: Next) => {

View File

@@ -1,36 +1,32 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<title>//inject-title//</title> <title>{title}</title>
<meta name="theme-color" content="#FFF" /> <meta name="theme-color" content="#FFF" />
<meta name="slack-app-id" content="//inject-slack-app-id//" /> <meta name="slack-app-id" content="{slack-app-id}" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="color-scheme" content="light dark" /> <meta name="color-scheme" content="light dark" />
<meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="description" content="//inject-description//" /> <meta name="description" content="{description}" />
<link rel="manifest" href="/static/manifest.webmanifest" /> <link rel="manifest" href="{cdn-url}/static/manifest.webmanifest" />
<link <link rel="canonical" href="{canonical-url}" data-react-helmet="true" />
rel="canonical" {prefetch}
href="//inject-canonical//"
data-react-helmet="true"
/>
//inject-prefetch//
<link <link
rel="shortcut icon" rel="shortcut icon"
type="image/png" type="image/png"
href="/static/images/favicon-32.png" href="{cdn-url}/static/images/favicon-32.png"
sizes="32x32" sizes="32x32"
/> />
<link <link
rel="apple-touch-icon" rel="apple-touch-icon"
type="image/png" type="image/png"
href="/static/images/apple-touch-icon.png" href="{cdn-url}/static/images/apple-touch-icon.png"
sizes="192x192" sizes="192x192"
/> />
<link <link
rel="search" rel="search"
type="application/opensearchdescription+xml" type="application/opensearchdescription+xml"
href="/opensearch.xml" href="{cdn-url}/opensearch.xml"
title="Outline" title="Outline"
/> />
<style> <style>
@@ -56,9 +52,7 @@
<body> <body>
<div id="root"></div> <div id="root"></div>
<script> {env}
//inject-env//
</script>
<script> <script>
if ( if (
window.localStorage && window.localStorage &&
@@ -71,6 +65,6 @@
.setAttribute("content", color); .setAttribute("content", color);
} }
</script> </script>
//inject-script-tags// {script-tags}
</body> </body>
</html> </html>