Issues with attaching `customId` to Files using `utapi.uploadFiles()`

Hey all!

I'm using uploadthing server side via the utapi library but when i try to attach a customId to a file object and upload I error out vs just uploading w/ no customId.

This is the code

    const uploadFile = new File([blob], `${imageCustomId}.png`, {
      type: 'image/png'
    }) as FileEsque;

    uploadFile.customId = imageCustomId; // Set the customId to the imageCustomId

    // Upload the image using fetch
    const uploadResponse = await utapi.uploadFiles(uploadFile);

    if (uploadResponse.error) {
      throw new Error(
        `Upload failed with Error: ${uploadResponse.error.message} and code: ${uploadResponse.error.code}`
      );
    }

    const uploadFile = new File([blob], `${imageCustomId}.png`, {
      type: 'image/png'
    }) as FileEsque;

    uploadFile.customId = imageCustomId; // Set the customId to the imageCustomId

    // Upload the image using fetch
    const uploadResponse = await utapi.uploadFiles(uploadFile);

    if (uploadResponse.error) {
      throw new Error(
        `Upload failed with Error: ${uploadResponse.error.message} and code: ${uploadResponse.error.code}`
      );
    }

Now when i do this - i get the following error (with debug mode on) - note that this is not a uploadResponse.error but an error caught by the wider try catch i have around this code.

Waiting for the debugger to disconnect...
Error capturing or uploading image: (FiberFailure) BadRequestError: Request to https://uploadthing.com/api/uploadFiles failed with status 500
    at eval (webpack-internal:///(rsc)/./node_modules/@uploadthing/shared/dist/index.js:465:102)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:1295:199)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:1043:5)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:679:3)
    at Object.execute (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:654:7)
    at resume (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:847:22)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:889:35)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
 GET /api/device/update 500 in 5858ms

Waiting for the debugger to disconnect...
Error capturing or uploading image: (FiberFailure) BadRequestError: Request to https://uploadthing.com/api/uploadFiles failed with status 500
    at eval (webpack-internal:///(rsc)/./node_modules/@uploadthing/shared/dist/index.js:465:102)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:1295:199)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:1043:5)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:679:3)
    at Object.execute (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:654:7)
    at resume (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:847:22)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:889:35)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
 GET /api/device/update 500 in 5858ms

If i simply comment out the customId assignment it works completely fine and i get a successful upload - having a customId is really important to how i'm using this - any help is appreciated!

TTC

Theo's Typesafe Cult•2y ago

desert.elf

Issues with attaching `customId` to Files using `utapi.uploadFiles()`

Hey all!

I'm using uploadthing server side via the utapi library but when i try to attach a customId to a file object and upload I error out vs just uploading w/ no customId.

This is the code

    const uploadFile = new File([blob], `${imageCustomId}.png`, {
      type: 'image/png'
    }) as FileEsque;

    uploadFile.customId = imageCustomId; // Set the customId to the imageCustomId

    // Upload the image using fetch
    const uploadResponse = await utapi.uploadFiles(uploadFile);

    if (uploadResponse.error) {
      throw new Error(
        `Upload failed with Error: ${uploadResponse.error.message} and code: ${uploadResponse.error.code}`
      );
    }

    const uploadFile = new File([blob], `${imageCustomId}.png`, {
      type: 'image/png'
    }) as FileEsque;

    uploadFile.customId = imageCustomId; // Set the customId to the imageCustomId

    // Upload the image using fetch
    const uploadResponse = await utapi.uploadFiles(uploadFile);

    if (uploadResponse.error) {
      throw new Error(
        `Upload failed with Error: ${uploadResponse.error.message} and code: ${uploadResponse.error.code}`
      );
    }

Now when i do this - i get the following error (with debug mode on) - note that this is not a uploadResponse.error but an error caught by the wider try catch i have around this code.

Waiting for the debugger to disconnect...
Error capturing or uploading image: (FiberFailure) BadRequestError: Request to https://uploadthing.com/api/uploadFiles failed with status 500
    at eval (webpack-internal:///(rsc)/./node_modules/@uploadthing/shared/dist/index.js:465:102)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:1295:199)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:1043:5)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:679:3)
    at Object.execute (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:654:7)
    at resume (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:847:22)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:889:35)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
 GET /api/device/update 500 in 5858ms

Waiting for the debugger to disconnect...
Error capturing or uploading image: (FiberFailure) BadRequestError: Request to https://uploadthing.com/api/uploadFiles failed with status 500
    at eval (webpack-internal:///(rsc)/./node_modules/@uploadthing/shared/dist/index.js:465:102)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:1295:199)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:1043:5)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:679:3)
    at Object.execute (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:654:7)
    at resume (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:847:22)
    at eval (webpack-internal:///(rsc)/./node_modules/effect/dist/esm/Micro.js:889:35)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
 GET /api/device/update 500 in 5858ms

If i simply comment out the customId assignment it works completely fine and i get a successful upload - having a customId is really important to how i'm using this - any help is appreciated!

Issues with attaching `customId` to Files using `utapi.uploadFiles()`

Issues with attaching `customId` to Files using `utapi.uploadFiles()`

Similar Threads

Similar Threads

Similar Threads