Level 122
view the raw message and see what image tag was created.
1 like
Apr 12, 2020
25
Level 6
Image logo is not showing in email
I added an logo to my image that is a template for email invoice. When they view the content of the email, the logo should be present.
This is how I imported it:
<div class="col-4 offset-4">
<img class="mx-auto mw-100" src="{{ asset('/storage/logo/Bujishu-logo.png') }}" alt="No Logo">
</div>
When I view my email to test it out, it just shows No Logo. I don't understand why it couldn't locate the image.
I tried using php artisan link storage and double check that it exists on
public -> storage - > logo -> Bujishu-logo.png
The spellings all checked out.
Why does it not work?
Level 6
I inspected the element and this was what was written:
<img data-imagetype="External" src="/actions/ei?u=http%3A%2F%2Fbujishu_web.test%2Fstorage%2Flogo%2FBujishu-logo.png&d=2020-04-13T06%3A18%3A03.974Z" originalsrc="http://bujishu_web.test/storage/logo/Bujishu-logo.png" data-connectorsauthtoken="1" data-imageproxyendpoint="/actions/ei" data-imageproxyid="" class="x_mx-auto x_mw-100" alt="No Logo">
Level 1
@CookieMonster try this <img src={{ "data:image/png;base64,".base64_encode(file_get_contents($image_url )) }} />
1 like
Level 10
@SonalKeraliya Please don't respond to old threads as it blocks up the forum. If you have a question, or want to discuss something create a new thread!
Level 122
The originalsrc looks ok. I assume this will be swapped back into the email when you choose to show remote images in your email client (outlook ?)
Does the machine you are viewing it on have access to http://bujishu_web.test
Level 6
How do I verify if it has permission?
I don't know if this is email related because I tested importing the same image on my blade files in my application (not email), it manages to load the image fine.
What should I be looking at to pinpoint the problem?
Level 122
In the same browser, copy the originalsrc url, eg http://bujishu_web.test/storage/logo/Bujishu-logo.png into your browser address bar - is the image loaded?
Level 28
do:
php artisan storage:link
in your .env file
update APP_URL to your current app url
then use
MAIL_DRIVER=log
to confirm everything works accordingly. this part is optional just to make it convenient to see the output...
Level 6
Yea, the image is loaded, meaning it has access to it since I am running on my local machine.
Level 122
So do you just need to tell your email client to display images from your test domain?
Level 28
if you log the email you can see the output instead of viewing it in the email. some time local server's are not allowed to display properly in email providers
Level 6
Yes but right now the image is not being displayed on my local machine so I kinda need to fix that issue before worrying about it working on the client email. If it works on my local machine,I am sure it will work on the client side as well.
Level 122
the image displays on your local machine
I said your email client eg outlook or whatever you use to read email
Is it a local application or a webmail site?
Level 6
Oh , yea it is a webmail site, it's outlook.live.com which I am using to view my image.
Level 122
So in outlook you need to tell it to display your image
Level 28
did you dump the email in the log? as I suggested?
Level 6
@mahin I don't understand your solution.
Level 6
@snapey So this isn't a code issue or if I didn't configure something in my .env file or wrong spelling of file?
Level 6
@snapey This is my .env file configuration:
APP_NAME=Bujishu
APP_ENV=local
APP_KEY=base64:kd9ax7QWyADDWrS9WMUNcqovNoAJBNxFgvy9KGGnwes=
APP_DEBUG=true
APP_URL=http://localhost
Is this a cause?
Level 6
I tested on both local and production environment, they can't render the image.
Level 1
You need to put full URL in your img src, including your domain and protocol (http/https).
Level 122
What, no, of course not.
You are sending an email with an image to your user.
Your user does not want to see images unless they trust the content. The mail service (Outlook) is protecting you by disabling images in the email.
In Gmail for example, there is a setting to always show images / ask before showing external images
In addition, gmail says
Sometimes, senders may know whether you've opened an email that has an image. Gmail scans every message for suspicious content. If Gmail thinks that a sender or message is suspicious, images aren’t shown and you’ll be asked if you want to see the images.
If you have this option enabled but you still don't see the image, make sure you improve the reputation of your email by setting DKIM and SPF records at your DNS server.
If you don't know how to use your mail client, then I can't really help you... sorry.
@koes we have already established that the email contains the full URL to the image
Level 6
@snapey Alright, I'll try your solution. Thanks.
Level 6
@snapey I solved the issue already. I had to use inline attachment in laravel:
https://laravel.com/docs/5.8/mail#inline-attachments
So the code looks like below:
<img class="mx-auto mw-100" src="{{ $message->embed(asset('/storage/logo/Bujishu-logo.png')) }}" alt="No Logo">
Level 122
its one workaround I suppose.
Please or to participate in this conversation.