diff --git a/Dockerfile b/Dockerfile
index bc92931..c2755cc 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -9,5 +9,5 @@ ENV PUBLIC_URL=http://localhost:4321
RUN npm run build
EXPOSE 4321
-CMD ["npm", "run", "dev", "--", "--host"]
-# CMD [ "node", "dist/sever/entry.mjs"]
+# CMD ["npm", "run", "dev", "--", "--host"]
+CMD [ "npm", "run", "preview", "--", "--host" ]
diff --git a/astro.config.mjs b/astro.config.mjs
index 60f2bfa..58360f6 100644
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -19,16 +19,5 @@ export default defineConfig({
vite: {
plugins: [tailwindcss()],
- server: {
- proxy: {
- // The idea is to proxy the Pocketbase connection to the current domain so the user doesn't have to open two ports
- // Currently works in dev (npm run dev -- --host) with the correct PUBLIC_URL var set but not through docker
- '/api': {
- target: PUBLIC_PB_URL,
- changeOrigin: true,
- rewrite: (path) => path.replace(/^\/api/, '/api'),
- },
- }
- }
}
});
\ No newline at end of file
diff --git a/docker-compose.yml b/docker-compose.yml
index a3d4d3b..7769074 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -2,7 +2,6 @@ services:
web:
build: .
env_file: .env
- network_mode: host
ports:
- "4321:4321"
diff --git a/src/components/Card/OverviewCard.astro b/src/components/Card/OverviewCard.astro
index 23618ee..8a73c9e 100644
--- a/src/components/Card/OverviewCard.astro
+++ b/src/components/Card/OverviewCard.astro
@@ -5,7 +5,7 @@ import TagRow from "./TagRow.astro"
const { recipe } = Astro.props;
const headerImage = await client.collection("images").getOne(recipe.images[0])
-const image = await client.files.getURL(headerImage, headerImage.image)
+const image = await client.files.getRelativeURL(headerImage, headerImage.image)
---
diff --git a/src/components/Detail/ImageCarousel.astro b/src/components/Detail/ImageCarousel.astro
index ece401e..bbdc8c6 100644
--- a/src/components/Detail/ImageCarousel.astro
+++ b/src/components/Detail/ImageCarousel.astro
@@ -4,7 +4,7 @@ const { class: className, recipe } = Astro.props
async function getLink(img: string) {
const record = await client.collection("images").getOne(img)
- const link = await client.files.getURL(record, record.image)
+ const link = await client.files.getRelativeURL(record, record.image)
return link
}
diff --git a/src/data/pocketbase.ts b/src/data/pocketbase.ts
index 0b05826..bc56688 100644
--- a/src/data/pocketbase.ts
+++ b/src/data/pocketbase.ts
@@ -1,5 +1,12 @@
import Pocketbase from "pocketbase"
-const client = new Pocketbase(import.meta.env.PUBLIC_URL)
+const client = new Pocketbase("http://localhost:4321")
client.autoCancellation(false)
+
+// Return a relative url for file instead of full path including localhost, which breaks external access
+client.files.getRelativeURL = (record: { [key: string]: any; }, filename: string, queryParams?: FileOptions | undefined) => {
+ const res = client.files.getURL(record, filename)
+ return res.substring(21)
+}
+
export default client;
\ No newline at end of file
diff --git a/src/pages/api/[...proxy].ts b/src/pages/api/[...proxy].ts
new file mode 100644
index 0000000..c831988
--- /dev/null
+++ b/src/pages/api/[...proxy].ts
@@ -0,0 +1,16 @@
+import type { APIRoute } from "astro";
+
+// THANK YOU https://stackoverflow.com/a/77297521 !!!!!!!
+
+const getProxyUrl = (request: Request) => {
+ const proxyUrl = new URL(import.meta.env.PUBLIC_PB_URL);
+ const requestUrl = new URL(request.url);
+
+ return new URL(requestUrl.pathname, proxyUrl);
+};
+
+export const ALL: APIRoute = async ({ request }) => {
+ const proxyUrl = getProxyUrl(request);
+ const response = await fetch(proxyUrl.href, request);
+ return new Response(response.body);
+};
\ No newline at end of file