Inline Images in email format are not loaded

ERPNext
1

Hi, I’ve been trying to send images inline in email notifications but the images won’t load and I can see a small white box which points to this link where the images is stored in (mysite)/files/images
https://ci4.googleusercontent.com/proxy/yYolKLqNL4CMGnebbzW7WXi_JKZFxrLcTG2bqkhmdZXUSkLu63fLkMucuz68tG3nwDFivIHnyCQX=s0-d-e1-ft#http://test/files/image.jpg

In the emails being sent out. How can I send the images inline in the email to customers.

I read somewhere about the security firewall or something but I have no idea about it and how will it help, alternatively I found this link for a fix about it but I’m not sure if this will help or not!
https://github.com/frappe/frappe/commit/fca5b4d002ff2cb59893aab24d9a47cd77d0c0ea

Experts please help!
Thank You

2

I am having the same issue.

Is no one else experiencing it?

3

Try using a secured server for sending images. Like your instance should be https://(yourerp)
and not http://(yourerp). This is the solution for the issue. Also try to provide full path to images rather than absoulute path.

1 Like
4

Hi,

Please excuse the ill mannered delay, I did not notice your reply until this morning. I am grateful for the clues as to how to proceed.

So …

In my MariaDb record I see the image URI is <img src="/files/SNGgKoL.jpe"> …

{
"SELECT subject, sender_full_name, recipients, communication_type, content
  FROM `_a7a7e96ba1644fd9`.tabCommunication":
  [
	{
		"subject" : "Try image 2019\/12\/13 07:03",
		"sender_full_name" : "Administrator",
		"recipients" : "yourself.yourorg@gmail.com, ",
		"communication_type" : "Communication",
		"content" : "<div><img src=\"\/files\/SNGgKoL.jpe\"><\/div>"
    }
  ]
}

Meanwhile in the recipient’s copy viewed in Gmail that same line is translated as :

<div><img src=3D"http://ib_erp.local/files/SNGgKoL.jpe"></div>

The problem is that the name I used to define my site is …

ib_erp.local

… whereas my endpoint URL is (for example) …

https://erp.your.org/

I tested secure and insecure URLs: https://erp.your.org/files/SNGgKoL.jpe & http://erp.your.org/files/SNGgKoL.jpe and can confirm that the image file is accessible at both those addresses.

Questions :

Does there exist a setting to redefine that URI from http://ib_erp.local/files to https://erp.your.org/files?

Is it obligatory to name the site exactly the same as the public domain name? (that’d really, really suck!)

Is there a way to prepare an HTML email body manually?

5

Ok.

I solved the problem:

I made two changes in my site configuration and two changes in my nginx configuration:

Before

├── frappe-bench
│   ├── config
│   │   ├── nginx.conf
│   └── sites
│       ├── currentsite.txt
│       └── ib_erp.local

After

├── frappe-bench
│   ├── config
│   │   ├── nginx.conf
│   │   ├── nginx.conf_bk20191213_1023
│   └── sites
│       ├── currentsite.txt
│       ├── currentsite.txt_bk20191213_1022
│       └── erp.your.org

Changes

I renamed my site directory, and changed the contents of currentsite.txt from …

ib_erp.local

… to …

erp.your.org

I also change two lines in nginx.conf

The external to internal name mapping from …

map $host $site_name_mnaixys {
        erp.your.org ib_erp.local;
        default $host;
}

… to …

map $host $site_name_mnaixys {
        erp.your.org erp.your.org;
        default $host;
}

I also renamed the virtual server block …

server {
        listen 80;
        server_name
                ib_erp.local
                ;

… to …

server {
        listen 80;
        server_name
                erp.your.org
                ;

I’m not certain of the correct way to restart ErpNext, and I’m working on a development VPS, so I just gave it the three finger salute. You might want to do something boring and timid like backup first.

6

Hi, now that we have the solution how can we close this issue. I’m sorry I’m pretty new to this whole thing as well.

7

So that worked for you?

8

Hi yes changing from http to https worked for the images. Also I uploaded the images to files list and gave a full path for every image like <img = … https://myerp/files/image_name>
Thank You so much

9

Oh cool!

Since you posed the original question, I believe you can mark it solved by returning to that post, where you should see a “solved” button.

10

Ooops. Wrong.

You should see a “Solution” button at the bottom right of the post that solved it.

11

Thank You so much, I’ve marked the solution.

12

In frappe 13.26.1 embedding images inline in emails is very easy:

def send_email_with_embedded_images():
    message = """
        <html><body>
            <p>Bild aus /assets: <img embed="assets/erpituc/images/ITUC Logo.png" alt="ITUC-LOGO aus /assets" /> </p>
            <p>Bild aus /files: <img embed="files/ITUC.png" alt="ITUC-LOGO aus /files"> </p>
        </body></html>
    """
    # Files are here:
    # /home/frappe/frappe-bench/apps/erpituc/erpituc/public/images/ITUC Logo.png
    # /home/frappe/frappe-bench/sites/erpnextthkr.schloss.ituc.de/public/files/ITUC.png

    frappe.sendmail(
        recipients=["you@your-company.de"],
        subject="send_email_with_embedded_images",
        message=message
    )
        
    print("E-Mail gesendet")

May work in older versions of frappe too.
Using <img embed='...'> in Notifications works too.

Result looks like this:
grafik