Hi Anshuman,
I’m still stuck with this - getting a CORS error when using the SDK head() function.
To reiterate I’m running the client locally.
Here is the calling code:
import { put, head, list } from '@vercel/blob';
export async function fetchDiagnosticsBundle(bundleTraceID) {
const key = diagnosticBundleKey(bundleTraceID)
try {
// @ts-ignore
const response = await head(key, blobCommandOptions());
const respJSON = Response.json(response);
debugger;
} catch (e) {
console.log(`fetchDiagnosticsBundle() failed with error: ${e}`)
}
return 42 // todo
}
Here is my project’s vercel.json
{
"headers": [
{
"source": "/api/blob",
"headers": [
{
"key": "Access-Control-Allow-Origin",
"value": "http://localhost:5173"
},
{
"key": "Access-Control-Allow-Methods",
"value": "HEAD, GET, POST, PUT, DELETE, OPTIONS"
},
{
"key": "Access-Control-Allow-Headers",
"value": "Content-Type, Authorization"
}
]
}
]
}```
And here is the reported error from the browser's console:
19:26:45.928 localhost/:1 Access to fetch at ‘https://vercel.com/api/blob?url=diagnosticbundle%2Fdae25d01-5e7d-4f48-95e9-c2dc5c1031e6’ from origin ‘http://localhost:5173’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
19:26:45.928 serverstorage.js:45 GET https://vercel.com/api/blob?url=diagnosticbundle%2Fdae25d01-5e7d-4f48-95e9-c2dc5c1031e6 net::ERR_FAILED 200 (OK)
blobFetch @ @vercel_blob.js?v=1ce2011b:634
blobRequest @ @vercel_blob.js?v=1ce2011b:731
(anonymous) @ @vercel_blob.js?v=1ce2011b:927
runAttempt @ @vercel_blob.js?v=1ce2011b:272
RetryOperation.attempt @ @vercel_blob.js?v=1ce2011b:111
run @ @vercel_blob.js?v=1ce2011b:281
retry2 @ @vercel_blob.js?v=1ce2011b:283
requestApi @ @vercel_blob.js?v=1ce2011b:923
head @ @vercel_blob.js?v=1ce2011b:1634
fetchDiagnosticsBundle @ serverstorage.js:45
handleFetchDiagnosticsDump @ handlewasmrecoverableerror.js:55```
I made sure to push the vercel.json to my main branch - and as you will see, a deployment was triggered.
ps here’s the referenced blobCommandOptions() function:
function blobCommandOptions() {
let options = {
access: 'public',
}
if (tokenForLocalDev) {
options.token = tokenForLocalDev;
}
return options
}```