chore: upload file to storage

Author: smarroufin

pages/storage.vue

@@ -19,12 +19,12 @@ async function addFile () {
   loading.value = true
 
   try {
+    const formData = new FormData()
+    formData.append('data', new Blob([JSON.stringify({ key })], {type: 'application/json'}))
+    formData.append('file', newFileValue.value)
     const file = await $fetch('/api/storage', {
       method: 'PUT',
-      body: {
-        key,
-        value
-      }
+      body: formData
     })
     const fileIndex = storage.value.findIndex(e => e.key === file.key)
     if (fileIndex !== -1) {

server/api/storage/index.put.ts

@@ -0,0 +1,32 @@
+import type { MultiPartData } from 'h3'
+
+export default eventHandler(async (event) => {
+  await requireUserSession(event)
+
+  const form: MultiPartData[] = await readMultipartFormData(event)
+  const dataPart = form.find((part) => part.name === 'data')
+  const filePart = form.find((part) => part.name === 'file')
+  if (!dataPart || !filePart) {
+    throw createError(`Missing ${!dataPart ? 'data' : 'file'} body param.`)
+  }
+
+  try {
+    const data = JSON.parse(dataPart.data)
+    const file = filePart.data.toString()
+
+    // Set entry for the current user
+
+    const res = await useBucket().put(data.key, file, {
+      customMetadata: {
+        filename: filePart.filename!,
+        type: filePart.type!
+      }
+    })
+    return res
+  } catch (e: any) {
+    throw createError({
+      statusCode: 500,
+      message: `Storage error: ${e.message}`
+    })
+  }
+})