chore(storage): attempt to serve file from route url

Author: smarroufin

pages/storage.vue

@@ -120,7 +120,7 @@ const items = [[{
         }"
         class="overflow-hidden relative"
       >
-        <img v-if="file.httpMetadata?.contentType?.startsWith('image/') && file.body" :src="`data:${file.httpMetadata.contentType};base64,${(file.body)}`" class="h-36 w-full object-cover">
+        <!-- <img v-if="file.httpMetadata?.contentType?.startsWith('image/')" :src="`/api/storage/${file.key}`" class="h-36 w-full object-cover"> -->
         <div class="h-36 w-full flex items-center justify-center p-2 text-center">
           {{ file.key }}
         </div>

server/api/storage/[key].get.ts

@@ -1,16 +1,11 @@
-import { ReadableStreamDefaultReader } from '@cloudflare/workers-types/experimental'
-import { useValidatedParams, useValidatedQuery, z, zh } from 'h3-zod'
+import { useValidatedParams, z } from 'h3-zod'
 
 export default eventHandler(async (event) => {
   await requireUserSession(event)
 
-
   const { key } = await useValidatedParams(event, {
     key: z.string().min(1).max(100)
   })
-  const { populate } = await useValidatedQuery(event, {
-    populate: zh.boolAsString.optional().default('false')
-  })
 
   // List files for the current user
 
@@ -21,14 +16,8 @@ export default eventHandler(async (event) => {
     throw createError({ message: 'File not found', statusCode: 404 })
   }
 
-  if (populate) {
-    const bodyReader: ReadableStreamDefaultReader<Uint8Array> = object.body.getReader()
-    const body = await processStream(bodyReader)
-    return {
-      ...object,
-      body: Buffer.from(body).toString('base64')
-    }
-  }
+  setHeader(event, 'Content-Type', object.httpMetadata!.contentType!)
+  setHeader(event, 'Content-Length', object.size)
 
-  return object
+  return object.body.getReader()
 })