Level 102
- Is the full url stored in database or only
\October2022\4rL6df8IgvncAVs4hhEZ.jpg. - What is your code for storing them
Oct 18, 2022
15
Level 2
Change image address stored in database.
I'm using voyager admin panel where I upload an image, it stored in storage folder and the address of this image is stored in database something like this http://localhost:8000/storage/homes\October2022\4rL6df8IgvncAVs4hhEZ.jpg.
If I do in my blade style="background-image: url({{asset('storage/'.$content->big_image)}})" like this.
It didn't work because the address of the image stored in laravel is stored with backslash '' instead of forward slash '/'.
In my inspect element, I changed the slashes like this
http://localhost:8000/storage/homes/October2022/4rL6df8IgvncAVs4hhEZ.jpg
and it worked. But how can I change it through the code.
Level 2
@Sinnbeck 1. The stored address is homes\October2022\4rL6df8IgvncAVs4hhEZ.jpg.
2. I'm using composer require tcg/voyager admin panel. Its their own functions to stored images in database. I haven't used any external code.
Level 102
@Sharim Oh ok I assume you actually had some code yourself when using it. Then I am unsure how to help. Maybe someone else is using it and knows a fix
Level 2
@Sinnbeck It happened only in background-image. If I use it in <img src="">. It worked fine.
Level 102
@Sharim Yeah well you need to store them with the correct /. Any chance you are on windows and it picks up the path delimiters are \ ?
Level 2
@Sinnbeck Yeah I'm on windows and it can pick this \ too. Even in the browser, I can open and see the image with same stored address in database. Only in the background-image is a problem.
Level 102
@Sharim That is correct. But then I dont understand the question? Are you looking for a browser that supports it in background-image ?
A fix for now can be this (or use an accessor)
style="background-image: url({{asset(str_replace('\\', '/', 'storage/'.$content->big_image))}})"
But if I were you I would try getting Voyager to work correctly (I have never used it so I dont know how it works)
Level 102
Did some digging in the issues and apparently its a known issue. https://github.com/the-control-group/voyager/issues/4924
Instead of using asset() use Voyager::image()
style="background-image: url({{Voyager::image('storage/'.$content->big_image)}})"
Level 2
@Sinnbeck Actually I don't want to override voyager's controller for this small issue. Here I found something in voyager's Media Controller:
$success = true;
$message = __('voyager::media.success_uploaded_file');
$path = preg_replace('/^public\//', '', $file);
event(new MediaFileAdded($path));
The code you just sent me is what I was looking for and it worked for me. But why I shouldn't use it?
Level 102
@Sharim Oh I am not asking you to change the voyager source. Just try and find the bug and if possible implement a fix in your own code. But apparently its a known issue that wont be fixed
Level 2
@Sinnbeck The str_replace is worked for me not ```Voyager::image()````. Maybe because I'm using my own controller to fetch the records. And voyager is not involved in any part to fetch the records. Because I'm using voyager only to store.
Level 102
@Sharim Ok well if it works then I assume thats fine. I could just see that it was the suggested solution on that thread
Level 2
@Sinnbeck Actually you're right. I checked the address from inspect element several time and we need to remove storage/ from the address. Now I added the code like this:
style="background-image: url({{Voyager::image($content->big_image)}})"
and it worked.
Level 102
@Sharim Ah exelent :) Didnt know it pointed to the storage directory already, but good to know
Level 2
@Sinnbeck Please storage/ from your correct answer so people will not confuse about the code.
Please or to participate in this conversation.