Level 102
Check the image src in the html source. Is the url correct? Is the APP_URL correct in your .env file?
Oct 27, 2021
14
Level 1
Images not showing on heroku
<img src="{{ asset('images/logo.png') }}" width="45" height="45">
Image is not displayed on the heroku app, please help
Level 1
@Sinnbeck In heroku APP_URL is already set, what to do?
Level 102
Check the image src in the html source. Is the url correct?
Right click the missing image, and select "Inspect element"
Level 1
@Sinnbeck is shows the image when click on right button open image in a new tab, but not showing on the page
Level 102
@ridwanhoque can you post a link?
Level 1
Level 102
@ridwanhoque F12 -> Console. Check the red errors.. Your image links are set to use http, while the site is https. Change your image links to https as well
example: https://pay-wm-pm.herokuapp.com/images/buy_me_a_coffee.png
Mixed Content: The page at 'https://pay-wm-pm.herokuapp.com/' was loaded over HTTPS, but requested an insecure image 'http://pay-wm-pm.herokuapp.com/images/buy_me_a_coffee.png'. This request has been blocked; the content must be served over HTTPS.
Level 102
@ridwanhoque same problem with all your links. They are http not https
Level 1
@Sinnbeck how to change this in a single shot ?
Level 102
@ridwanhoque Fix your ASSET_URL. It is most likely http://pay-wm-pm.herokuapp.com instead of https://pay-wm-pm.herokuapp.com
in .env
ASSET_URL=https://pay-wm-pm.herokuapp.com
Level 1
@Sinnbeck thanks a lot, I set asset url using https, now solved, thanks
Level 102
@ridwanhoque If you have ASSET_URL as well you need to also fix that
Or it can be cached.
php artisan optimize
Level 80
@ridwanhoque The issue you’ll be having is, your app is being server by Heroku’s load balancers. You’ll need to set up your trusted proxies so that it correctly detects the request is HTTPS and generates URLs as such:
<?php
namespace App\Http\Middleware;
use Fideloper\Proxy\TrustProxies as Middleware;
use Illuminate\Http\Request;
class TrustProxies extends Middleware
{
protected $proxies = '*';
protected $headers = Request::HEADER_X_FORWARDED_AWS_ELB;
}
Level 2
I have also same issues it worked on static image but not on dynamic images src="https://laragig.herokuapp.com/images/logo.png" - working src="https://laragig.herokuapp.com/storage/logos/P2faVv6SQbEfEqY9bi3Fz9aw27l0WKjjZD1HHA6z.png" - not working is there any solutions?
Please or to participate in this conversation.