Issue
I have 2 apps, 1 for dashboard (VueJS) and 1 for api (Laravel)...
In my laravel, I have an api function that uploads an image to my s3 bucket :
class ImageController extends Controller
{
public function __construct()
{
$this->middleware('auth:api', ['except' => ['uploadimage']]);
$this->middleware('cors');
}
public function uploadimage(Request $request) {
$disk = Storage::disk('s3');
$disk->put($request->path.'/'.$request->file_name, base64_decode($request->file));
}
}
and I called this function in my VueJS App by:
uploadImage(ext) {
const d = new Date();
const self = this;
const f = new URLSearchParams();
f.append('user_id', localStorage.getItem('id'))
f.append('file_name', 'ProfilePicture-'+d.getTime()+'-'+localStorage.getItem('id')+'.'+ext);
f.append('path', 'public/images');
f.append('file', this.image_crop[0].replace(/^data:image\/[a-z]+;base64,/, ''));
this.axios.post('uploadimage'), f, {
headers: ''
}).then(response => {
const status = response.data.status;
if (status == 1) {
Toast._success(self, 'Success!', 'You have successfully updated your profile picture.');
} else {
if (status == 0) {
Toast._error(self, 'Oops!', 'Something went wrong. Please try again later.');
}
}
console.log('res ', response);
}).catch(err => {
console.log('err ', err);
})
}
This works well on my local development environment with local db(xampp)..
but when I deploy the Laravel and VueJS App
in my AWS ec2 ubuntu(apache) with RDS mysql db and upload an image, I get this error
InvalidArgumentException: The PutObject operation requires non-empty parameters: Bucket in file /var/www/api.myapp.com/public_html/myapp_be/vendor/aws/aws-sdk-php/src/InputValidationMiddleware.php
Btw, api.myapp.com
is where the Laravel
located.
I'm new to Laravel
and AWS
and I just can't find anything related to this problem.
Any idea how to resolve this?
Solution
Solved the issue, it was just that I forgot to populate the s3
properties in the filesystems.php
.
To resolve the issue, follow the steps:
1. Go to filesystems.php
2. Find the disk
array and inside it is the s3
array
3. In the s3
array, fill the following properties with the values the same in the .env
:
'disks' => [
'local' => [
...
],
'public' => [
...
],
's3' => [
'driver' => 's3',
'key' => env('AWS_ACCESS_KEY_ID', 'Same with the AWS_ACCESS_KEY_ID value in the .env file'),
'secret' => env('AWS_SECRET_ACCESS_KEY', 'Same with the AWS_ACCESS_KEY_ID value in the .env file'),
'region' => env('AWS_DEFAULT_REGION', 'Same with the AWS_DEFAULT_REGION value in the .env file'),
'bucket' => env('AWS_BUCKET', 'Your s3 bucket'),
'url' => env('AWS_URL'), //You can keep this as is
'endpoint' => env('AWS_ENDPOINT'), //You can keep this as is
],
],
Hope this helps someone with the same problem.
Answered By - modi Answer Checked By - Clifford M. (WPSolving Volunteer)