CODEWITHSUNDEEP
laravelamazon-web-servicesamazon-s3file-uploadlaravel-livewire
Danny Younes
Danny Younes

Reputation: 619

Laravel Livewire uploading files to AWS S3 bucket

I am attempting to upoad files using laravel livewire.

I have created my S3 bucket. I have also created my user with AWSS3FullAccessRights.

By default my s3 bucket has public access turned off.

When I upload a files I am getting a 403 forbidden error. The request URL is:

https://[bucket_name].s3.ap-southeast-2.amazonaws.com/livewire-tmp/HeFkgK7BTeFv2voaPzMPJdwqX69KQ4-metac2FtcGxlLW1wNC1maWxlLm1wNA%3D%3D-.mp4?x-amz-acl=private&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAS3BSKYVMYVLYCB44%2F20201025%2Fap-southeast-2%2Fs3%2Faws4_request&X-Amz-Date=20201025T041359Z&X-Amz-SignedHeaders=host%3Bx-amz-acl&X-Amz-Expires=300&X-Amz-Signature=9e87a654cbeab84772c18a950741027e7eeea1ad41b28e7b1c84a60cf2266147.

The file is not getting uploaded to S3 at all. My livewire settings file is set to s3. I have entered my key, secret, region and bucket name into my .env file.

Are there any other permissions I need to setup on AWS for this to work. All the tutorials I have looked at don't work and not sure why.

Any heklp would be appreciated

Thanks Danny

Upvotes: 2

Views: 2956

Answers (1)

Danny Younes
Danny Younes

Reputation: 619

The issue here was with allowing cross-origin requests. I had to insert the following code into the CORS configurations in the S3 bucket

<CORSConfiguration>
 <CORSRule>
   <AllowedOrigin>http://www.example1.com</AllowedOrigin>

   <AllowedMethod>PUT</AllowedMethod>
   <AllowedMethod>POST</AllowedMethod>
   <AllowedMethod>DELETE</AllowedMethod>

   <AllowedHeader>*</AllowedHeader>
 </CORSRule>
 <CORSRule>
   <AllowedOrigin>http://www.example2.com</AllowedOrigin>

   <AllowedMethod>PUT</AllowedMethod>
   <AllowedMethod>POST</AllowedMethod>
   <AllowedMethod>DELETE</AllowedMethod>

   <AllowedHeader>*</AllowedHeader>
 </CORSRule>
 <CORSRule>
   <AllowedOrigin>*</AllowedOrigin>
   <AllowedMethod>GET</AllowedMethod>
 </CORSRule>
</CORSConfiguration>

Upvotes: 4

Related Questions