Uploading and accessing static assets during runtime (docker/coolify)

[mikekok]

I have a sveltekit app that lets the user upload images to the /static/img directory using writeFile (fs) and access it right away from their homepage.

It works fine when I run it locally but when I deploy the app to coolify the images in the /static/img directory are not persistent, meaning they get deleted after each redeployment.

I tried making it persistent by mounting a volume, which worked, but I can't really access the images in that directory from my homepage during runtime (e.g. by using <img src="/img/test.jpg" /> or visiting their direct url at https://website.com/img/test.jpg).

I'm new to docker and coolify and I've been searching for a solution for hours but can't figure out how I should do it.
I don't want to use an image CDN.

This is my /api/upload/server.js file that uploads the images to the /static/img directory:

import { writeFile } from "fs"

export async function POST({ request }) {
  const data = await request.json()
  const { code, image } = data

  writeFile(`static/img/${code}.jpg`, image, "base64", (err) => {
    if (err) console.log(err)
    else {
      console.log("File written successfully")
    }
  })
}

[teemingc]

I'd suggest only using /static for your website assets and instead create a GET endpoint that reads the files from your volume and returns the content in a response. This makes it so that <img src="/img/test.jpg" /> hits your GET endpoint when retrieving the image.

[mikekok]

That's exactly what I ended up doing, thanks!