Level 44
I resolved this by adding a CORS configuration in my bucket:
https://stackoverflow.com/questions/17533888/s3-access-control-allow-origin-header
Nov 28, 2018
7
Level 6
Issue with S3 Image urls in Nova
Hi all,
I'm having some issues with utilising Amazon S3 with Nova Image fields and wondered if you could help me please.
Some current set-up information:
- I am using Nova 1.1.9
My filesystems.php config is set to point to my public disk and the code for that is:
'public' => [
'driver' => 's3',
'key' => env('AWS_ACCESS_KEY_ID'),
'secret' => env('AWS_SECRET_ACCESS_KEY'),
'region' => env('AWS_DEFAULT_REGION'),
'bucket' => env('AWS_BUCKET'),
],
My Nova Image field is set-up as so:
Image::make('Photo URL', 'photo_url'),
I have also tried:
Image::make('Photo URL', 'photo_url')->disk('public'),
The problems I am facing are that when I upload an image or view an image the URL points to the S3 path, followed the full URL of my projects environment. e.g. https://XXX.s3.eu-west-2.amazonaws.com/https://myappurl.com/image.jpg thus issuing a 404 error
I have gone through the documentation and can't work it out. Is there any other steps I am missing?
To confirm, I don't have any problems storing or viewing outside of the Nova application.
Any help will be greatly appreciated.
Many Thanks, Jamie
Level 6
Hi,
It's not CORS. That is already set correctly.
The upload works, It's the path that gets output onto the page that is incorrect. It is referencing the full Amazon S3 bucket URL and then straight after references my actual projects URL.
Level 44
@WORLDWEBDEVELOPMENT - Here's how I'm getting my s3 pic in Nova:
Image::make('Photo', 'photo_url', 's3'),
I also had to make sure that photo_url wasn't a s3 temporary url (Nova does this for you)...photo_url here would have to be just the file name that's in your s3 bucket...so you may want to create a new attribute on your Model and do something like this
Image::make('Photo', 's3_file_name', 's3'),
Level 6
@realrandyallen - so to mirror yours I changed it to:
Image::make('Photo', 'photo_url', 's3')
When I upload a photo it stores in the database as just the filename.
But when I view the URL on the index page I get the Nova generated S3 bucket URL, then my project URL, then the filename.
It's the injection of the project URL that is causing the issue. I don't know why/where it is adding this in.
Level 44
@WORLDWEBDEVELOPMENT - I believe it's because photo_url in your case is a s3 temporary url...if photo_url is a custom accessor on your model like this:
public function getPhotoUrlAttribute()
{
return Storage::disk('s3')->temporaryUrl($this->s3_file_name, now()->addMinutes(30))
}
Then that's an issue, it needs to be an attribute that just returns $this->s3_file_name
If you want you can post your model where this field is coming from
1 like
Level 6
@REALRANDYALLEN - Ah yes. Sorry, I see what you are saying now. I am using Spark also which has photo_url as a custom accessor.
I've just done an override on my model for this and it's all working now.
Thank you for helping me out with this.
1 like
Level 44
@WORLDWEBDEVELOPMENT - No problem, glad you got it working!
Please or to participate in this conversation.