"Failed to retrieve client token" error with Vercel Blob uploads

v0
1

Hello Vercel Support Team,

I am encountering a persistent “Failed to retrieve the client token” error when attempting to upload images to Vercel Blob from my Next.js application. The error occurs in my /api/upload/route.ts serverless function, which uses @vercel/blob/client’s handleUpload function.

Here’s a summary of the situation and the troubleshooting steps I’ve already taken:

  1. Error Message: The exact error displayed in the application and console is:
Server Error: Failed to upload image: Vercel Blob: Failed to retrieve the client token
at uploadFileToBlob (/lib/client-upload)
at async uploadMultipleImagesClient (/lib/client-upload)
at async Object.uploadFiles (/components/client-image-upload)
at async handleSubmit (/app/dashboard/products/page)
  1. Environment Variable Configuration: I have verified in my Vercel project settings (under “Settings” > “Environment Variables”) that the BLOB_READ_WRITE_TOKEN is correctly set for “All Environments” and has a valid value. (I can provide a screenshot if needed).
  2. Blob Store Status: I have also confirmed that my “stores” Blob Store is active and configured in the “Storage” tab of my Vercel project. (Screenshot available).
  3. Build and Deployment Status: My project builds and deploys successfully. The deployment logs show that the /api/upload route is correctly identified and built as a serverless function. There are no critical errors or warnings during the build process that indicate an issue with environment variable access. (Screenshots of build logs available).
  4. Vercel Status Page: I have checked status.vercel.com, and all systems are reported as operational.
  5. Code Implementation: My implementation for client uploads and the API route (app/api/upload/route.ts and lib/client-upload.ts) follows the official Vercel Blob documentation for client uploads.

Despite these checks, the error persists, suggesting that the BLOB_READ_WRITE_TOKEN is not being correctly accessed by the serverless function at runtime.

Could you please help me investigate why the BLOB_READ_WRITE_TOKEN is not being retrieved by my serverless function during runtime? Any insights or further diagnostic steps you can provide would be greatly appreciated.

Thank you,
[Eng Amin]

image
image437×846 65.2 KB

4

Hi, @engamin1!

From the error you’re seeing, it looks like the issue is coming from how the client token is being generated during your upload flow. The “Failed to retrieve the client token” message usually means something’s off in that token generation step that enables uploads from the client side.

Here are a few things worth checking:

  1. Your API Route Setup
    Double-check that your /api/upload endpoint is set up to support the client upload process. It should handle generating the token correctly and allow the upload to complete without issues.

  2. Environment Variables
    Make sure the BLOB_READ_WRITE_TOKEN environment variable is actually available in your serverless function. Even if it’s set, sometimes it helps to log it out or confirm that your function has access to it.

  3. Client-Side Upload Call

    On the client side, make sure you’re pointing the upload to the correct API route and that the upload method you’re using is designed for client-side usage. It’s easy to accidentally mix up server-side and client-side upload methods, which can cause this kind of error.

If you’re still stuck after checking those things, feel free to share your current API route setup and upload logic. I can help take a closer look with that context :smiley:

5

The error is only occurring in the v0 preview but after deployment the upload is perfect working.

So i got this after i published the error

Thnks