Put API prefix in server only file to access process.env

This commit is contained in:
thiloho
2024-08-19 20:33:23 +02:00
parent 488877b2ed
commit 28774dc944
15 changed files with 29 additions and 25 deletions

View File

@@ -1,5 +1,5 @@
import { redirect } from "@sveltejs/kit"; import { redirect } from "@sveltejs/kit";
import { API_BASE_PREFIX } from "$lib/utils"; import { API_BASE_PREFIX } from "$lib/server/utils";
export const handle = async ({ event, resolve }) => { export const handle = async ({ event, resolve }) => {
if (!event.url.pathname.startsWith("/api/")) { if (!event.url.pathname.startsWith("/api/")) {

View File

@@ -0,0 +1,3 @@
import { dev } from "$app/environment";
export const API_BASE_PREFIX = dev ? "http://localhost:3000" : `${process.env.ORIGIN}/api`;

View File

@@ -113,7 +113,7 @@ export const md = markdownit({
md.core.ruler.push("header_sections", addSections); md.core.ruler.push("header_sections", addSections);
}); });
export const handleImagePaste = async (event: ClipboardEvent) => { export const handleImagePaste = async (event: ClipboardEvent, API_BASE_PREFIX: string) => {
const clipboardItems = Array.from(event.clipboardData?.items || []); const clipboardItems = Array.from(event.clipboardData?.items || []);
const file = clipboardItems.find((item) => item.type.startsWith("image/")); const file = clipboardItems.find((item) => item.type.startsWith("image/"));
@@ -145,6 +145,3 @@ export const handleImagePaste = async (event: ClipboardEvent) => {
return newContent; return newContent;
}; };
export const API_BASE_PREFIX = dev ? "http://localhost:3000" : `${import.meta.env.PUBLIC_ORIGIN}/api`;
export const NGINX_BASE_PREFIX = dev ? "http://localhost:18000" : "";

View File

@@ -1,5 +1,5 @@
import type { Actions } from "./$types"; import type { Actions } from "./$types";
import { API_BASE_PREFIX } from "$lib/utils"; import { API_BASE_PREFIX } from "$lib/server/utils";
export const actions: Actions = { export const actions: Actions = {
default: async ({ request, cookies, fetch }) => { default: async ({ request, cookies, fetch }) => {

View File

@@ -1,5 +1,5 @@
import type { Actions } from "./$types"; import type { Actions } from "./$types";
import { API_BASE_PREFIX } from "$lib/utils"; import { API_BASE_PREFIX } from "$lib/server/utils";
export const actions: Actions = { export const actions: Actions = {
default: async ({ request, fetch }) => { default: async ({ request, fetch }) => {

View File

@@ -1,5 +1,5 @@
import type { Actions, PageServerLoad } from "./$types"; import type { Actions, PageServerLoad } from "./$types";
import { API_BASE_PREFIX } from "$lib/utils"; import { API_BASE_PREFIX } from "$lib/server/utils";
export const load: PageServerLoad = async ({ fetch, cookies, url, locals }) => { export const load: PageServerLoad = async ({ fetch, cookies, url, locals }) => {
const searchQuery = url.searchParams.get("website_search_query"); const searchQuery = url.searchParams.get("website_search_query");

View File

@@ -1,5 +1,5 @@
import type { Actions, PageServerLoad } from "./$types"; import type { Actions, PageServerLoad } from "./$types";
import { API_BASE_PREFIX } from "$lib/utils"; import { API_BASE_PREFIX } from "$lib/server/utils";
export const load: PageServerLoad = async ({ locals }) => { export const load: PageServerLoad = async ({ locals }) => {
return { return {

View File

@@ -1,5 +1,5 @@
import type { LayoutServerLoad } from "./$types"; import type { LayoutServerLoad } from "./$types";
import { API_BASE_PREFIX } from "$lib/utils"; import { API_BASE_PREFIX } from "$lib/server/utils";
import { error } from "@sveltejs/kit"; import { error } from "@sveltejs/kit";
export const load: LayoutServerLoad = async ({ params, fetch, cookies }) => { export const load: LayoutServerLoad = async ({ params, fetch, cookies }) => {

View File

@@ -1,5 +1,5 @@
import type { Actions, PageServerLoad } from "./$types"; import type { Actions, PageServerLoad } from "./$types";
import { API_BASE_PREFIX } from "$lib/utils"; import { API_BASE_PREFIX } from "$lib/server/utils";
export const load: PageServerLoad = async ({ params, fetch, cookies, url }) => { export const load: PageServerLoad = async ({ params, fetch, cookies, url }) => {
const globalSettingsData = await fetch( const globalSettingsData = await fetch(
@@ -39,7 +39,8 @@ export const load: PageServerLoad = async ({ params, fetch, cookies, url }) => {
return { return {
globalSettings, globalSettings,
header, header,
footer footer,
API_BASE_PREFIX
}; };
}; };

View File

@@ -5,7 +5,6 @@
import SuccessOrError from "$lib/components/SuccessOrError.svelte"; import SuccessOrError from "$lib/components/SuccessOrError.svelte";
import type { ActionData, PageServerData } from "./$types"; import type { ActionData, PageServerData } from "./$types";
import Modal from "$lib/components/Modal.svelte"; import Modal from "$lib/components/Modal.svelte";
import { API_BASE_PREFIX } from "$lib/utils";
const { data, form } = $props<{ data: PageServerData; form: ActionData }>(); const { data, form } = $props<{ data: PageServerData; form: ActionData }>();
@@ -19,7 +18,7 @@
}; };
const handlePaste = async (event: ClipboardEvent) => { const handlePaste = async (event: ClipboardEvent) => {
const newContent = await handleImagePaste(event); const newContent = await handleImagePaste(event, data.API_BASE_PREFIX);
previewContent = newContent; previewContent = newContent;
}; };
</script> </script>
@@ -72,7 +71,7 @@
{#if data.globalSettings.favicon_image} {#if data.globalSettings.favicon_image}
<Modal id="preview-favicon-global-{data.globalSettings.website_id}" text="Preview"> <Modal id="preview-favicon-global-{data.globalSettings.website_id}" text="Preview">
<img <img
src={`${API_BASE_PREFIX}/rpc/retrieve_file?id=${data.globalSettings.favicon_image}`} src={`${data.API_BASE_PREFIX}/rpc/retrieve_file?id=${data.globalSettings.favicon_image}`}
alt="" alt=""
/> />
</Modal> </Modal>
@@ -125,7 +124,10 @@
</label> </label>
{#if data.header.logo_image} {#if data.header.logo_image}
<Modal id="preview-logo-header-{data.header.website_id}" text="Preview"> <Modal id="preview-logo-header-{data.header.website_id}" text="Preview">
<img src={`${API_BASE_PREFIX}/rpc/retrieve_file?id=${data.header.logo_image}`} alt="" /> <img
src={`${data.API_BASE_PREFIX}/rpc/retrieve_file?id=${data.header.logo_image}`}
alt=""
/>
</Modal> </Modal>
{/if} {/if}
</div> </div>

View File

@@ -1,5 +1,5 @@
import type { Actions, PageServerLoad } from "./$types"; import type { Actions, PageServerLoad } from "./$types";
import { API_BASE_PREFIX } from "$lib/utils"; import { API_BASE_PREFIX } from "$lib/server/utils";
export const load: PageServerLoad = async ({ params, fetch, cookies, url, parent, locals }) => { export const load: PageServerLoad = async ({ params, fetch, cookies, url, parent, locals }) => {
const searchQuery = url.searchParams.get("article_search_query"); const searchQuery = url.searchParams.get("article_search_query");

View File

@@ -1,5 +1,5 @@
import type { Actions, PageServerLoad } from "./$types"; import type { Actions, PageServerLoad } from "./$types";
import { API_BASE_PREFIX } from "$lib/utils"; import { API_BASE_PREFIX } from "$lib/server/utils";
export const load: PageServerLoad = async ({ parent, params, cookies, fetch }) => { export const load: PageServerLoad = async ({ parent, params, cookies, fetch }) => {
const articleData = await fetch(`${API_BASE_PREFIX}/article?id=eq.${params.articleId}`, { const articleData = await fetch(`${API_BASE_PREFIX}/article?id=eq.${params.articleId}`, {
@@ -14,7 +14,7 @@ export const load: PageServerLoad = async ({ parent, params, cookies, fetch }) =
const article = await articleData.json(); const article = await articleData.json();
const { website } = await parent(); const { website } = await parent();
return { website, article }; return { website, article, API_BASE_PREFIX };
}; };
export const actions: Actions = { export const actions: Actions = {

View File

@@ -5,7 +5,7 @@
import SuccessOrError from "$lib/components/SuccessOrError.svelte"; import SuccessOrError from "$lib/components/SuccessOrError.svelte";
import type { ActionData, PageServerData } from "./$types"; import type { ActionData, PageServerData } from "./$types";
import Modal from "$lib/components/Modal.svelte"; import Modal from "$lib/components/Modal.svelte";
import { API_BASE_PREFIX, handleImagePaste } from "$lib/utils"; import { handleImagePaste } from "$lib/utils";
const { data, form } = $props<{ data: PageServerData; form: ActionData }>(); const { data, form } = $props<{ data: PageServerData; form: ActionData }>();
@@ -19,7 +19,7 @@
}; };
const handlePaste = async (event: ClipboardEvent) => { const handlePaste = async (event: ClipboardEvent) => {
const newContent = await handleImagePaste(event); const newContent = await handleImagePaste(event, data.API_BASE_PREFIX);
previewContent = newContent; previewContent = newContent;
}; };
</script> </script>
@@ -86,7 +86,7 @@
{#if data.article.cover_image} {#if data.article.cover_image}
<Modal id="preview-cover-article-{data.article.id}" text="Preview"> <Modal id="preview-cover-article-{data.article.id}" text="Preview">
<img <img
src={`${API_BASE_PREFIX}/rpc/retrieve_file?id=${data.article.cover_image}`} src={`${data.API_BASE_PREFIX}/rpc/retrieve_file?id=${data.article.cover_image}`}
alt="" alt=""
/> />
</Modal> </Modal>

View File

@@ -1,5 +1,5 @@
import type { Actions, PageServerLoad } from "./$types"; import type { Actions, PageServerLoad } from "./$types";
import { API_BASE_PREFIX } from "$lib/utils"; import { API_BASE_PREFIX } from "$lib/server/utils";
export const load: PageServerLoad = async ({ parent, params, fetch, cookies }) => { export const load: PageServerLoad = async ({ parent, params, fetch, cookies }) => {
const { website, home } = await parent(); const { website, home } = await parent();

View File

@@ -2,12 +2,13 @@ import { readFile, mkdir, writeFile } from "node:fs/promises";
import { join } from "node:path"; import { join } from "node:path";
import { md } from "$lib/utils"; import { md } from "$lib/utils";
import type { Actions, PageServerLoad } from "./$types"; import type { Actions, PageServerLoad } from "./$types";
import { API_BASE_PREFIX, NGINX_BASE_PREFIX } from "$lib/utils"; import { API_BASE_PREFIX } from "$lib/server/utils";
import { render } from "svelte/server"; import { render } from "svelte/server";
import BlogIndex from "$lib/templates/blog/BlogIndex.svelte"; import BlogIndex from "$lib/templates/blog/BlogIndex.svelte";
import BlogArticle from "$lib/templates/blog/BlogArticle.svelte"; import BlogArticle from "$lib/templates/blog/BlogArticle.svelte";
import DocsIndex from "$lib/templates/docs/DocsIndex.svelte"; import DocsIndex from "$lib/templates/docs/DocsIndex.svelte";
import DocsEntry from "$lib/templates/docs/DocsEntry.svelte"; import DocsEntry from "$lib/templates/docs/DocsEntry.svelte";
import { dev } from "$app/environment";
export const load: PageServerLoad = async ({ params, fetch, cookies }) => { export const load: PageServerLoad = async ({ params, fetch, cookies }) => {
const websiteOverviewData = await fetch( const websiteOverviewData = await fetch(
@@ -26,7 +27,7 @@ export const load: PageServerLoad = async ({ params, fetch, cookies }) => {
generateStaticFiles(websiteOverview); generateStaticFiles(websiteOverview);
const websitePreviewUrl = `${NGINX_BASE_PREFIX}/previews/${websiteOverview.id}/index.html`; const websitePreviewUrl = `${dev ? "http://localhost:18000" : ""}/previews/${websiteOverview.id}/index.html`;
return { return {
websiteOverview, websiteOverview,