Reputation: 19
I'm trying to upload from localhost to digital ocean's space .
For this, I use the npm package. But I am getting the error given below. What code should I add to this package so that I don't get an error.
Access to fetch at 'https://****.fra1.digitaloceanspaces.com/directory/aaa.txt?x-id=PutObject' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
My codes:
const handleFileUpload = async file => {
const bucketParams = { Bucket: "bucketname", Key: "directory/aaa.txt", ACL: "public-read", Body: "xxxxxxxxxxxxxx",
};
const command = new AbortMultipartUploadCommand(bucketParams);
try {
const data = await s3Client
.send(new PutObjectCommand(bucketParams));
} catch (error) {
// error handling.
} finally {
// finally.
}
};
/// Connection code
import { S3 } from "@aws-sdk/client-s3";
export const s3Client = new S3({ endpoint: "https://fra1.digitaloceanspaces.com", region: "us-east-1", credentials: { accessKeyId: "xxxxxx", secretAccessKey: "xxxx", } }) ;
Upvotes: 1
Views: 1375
Reputation: 1
I had the same problem and this answer solves my problems, basically it is the Bucket configuration in AWS. https://stackoverflow.com/a/64586341/25517233
You need to go in the bucket configuration with permission and add this lines:
[
{
"AllowedHeaders": [
"*"
],
"AllowedMethods": [
"GET",
"HEAD"
],
"AllowedOrigins": [
"*"
],
"ExposeHeaders": [],
"MaxAgeSeconds": 3000
}
]
Just remeber to add the methos you using. For example, i need add "PUT" in AllowedMethods
Upvotes: 0