MetatroncubeSoftwareSolutions/shopify-custom-email-plugin
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: Use CID inline attachment for logo instead of blocked base64 data URI

Browse Source
This commit is contained in:
Alaguraj0361 2026-05-19 11:00:04 +05:30
parent f0026f65dd
commit 30dec851e9
1 changed files with 31 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
mailer.js
View File

@ -25,13 +25,13 @@ const sendEmailWithAttachment = async (toEmail, orderData, pdfBuffer) => {
const orderNumber = orderData.order_number || orderData.name; const orderNumber = orderData.order_number || orderData.name;
const currencySymbol = orderData.currency === 'INR' ? 'Rs. ' : `${orderData.currency} `; const currencySymbol = orderData.currency === 'INR' ? 'Rs. ' : `${orderData.currency} `;
// Load logo as base64 so it always displays in Gmail (no external URL blocking) // Check if local logo exists for CID inline attachment
const localLogoPath = path.join(__dirname, 'logo.png'); const localLogoPath = path.join(__dirname, 'logo.png');
let logoBase64 = ''; const logoExists = fs.existsSync(localLogoPath);
let logoMimeType = 'image/png'; // Use cid:store_logo in HTML - Gmail renders CID attachments correctly
if (fs.existsSync(localLogoPath)) { const logoImgTag = logoExists
logoBase64 = fs.readFileSync(localLogoPath).toString('base64'); ? `<img src="cid:store_logo" alt="rayaarishop" style="height: 55px; width: auto; display: block;" />`
} : `<span style="font-family: Helvetica, Arial, sans-serif; font-size: 20px; font-weight: bold; color: #ffffff;">rayaarishop</span>`;
// --- 1. Generate Order Summary Rows HTML --- // --- 1. Generate Order Summary Rows HTML ---
let orderRowsHtml = ''; let orderRowsHtml = '';
@ -112,10 +112,7 @@ const sendEmailWithAttachment = async (toEmail, orderData, pdfBuffer) => {
<table border="0" cellpadding="0" cellspacing="0" width="100%"> <table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr> <tr>
<td style="vertical-align: middle;"> <td style="vertical-align: middle;">
${logoBase64 ${logoImgTag}
? `<img src="data:${logoMimeType};base64,${logoBase64}" alt="rayaarishop" style="height: 55px; width: auto; display: block;" />`
: `<span style="font-family: Helvetica, Arial, sans-serif; font-size: 20px; font-weight: bold; color: #ffffff;">rayaarishop</span>`
}
</td> </td>
<td align="right" style="vertical-align: middle;"> <td align="right" style="vertical-align: middle;">
<h1 style="font-family: Helvetica, Arial, sans-serif; font-size: 22px; font-weight: bold; color: #ffffff; margin: 0;">New Order: #${orderNumber}</h1> <h1 style="font-family: Helvetica, Arial, sans-serif; font-size: 22px; font-weight: bold; color: #ffffff; margin: 0;">New Order: #${orderNumber}</h1>
@ -134,9 +131,9 @@ const sendEmailWithAttachment = async (toEmail, orderData, pdfBuffer) => {
</p> </p>
<p style="font-family: Helvetica, Arial, sans-serif; font-size: 14px; color: #475569; margin: 0;"> <p style="font-family: Helvetica, Arial, sans-serif; font-size: 14px; color: #475569; margin: 0;">
${orderData.order_status_url ${orderData.order_status_url
? `<a href="${orderData.order_status_url}" target="_blank" style="color: #1d4ed8; font-weight: bold; text-decoration: none;">[Order #${orderNumber}]</a>` ? `<a href="${orderData.order_status_url}" target="_blank" style="color: #1d4ed8; font-weight: bold; text-decoration: none;">[Order #${orderNumber}]</a>`
: `<strong>[Order #${orderNumber}]</strong>` : `<strong>[Order #${orderNumber}]</strong>`
} }
<strong> (${new Date(orderData.created_at || Date.now()).toLocaleDateString('en-US', { month: 'long', day: 'numeric', year: 'numeric' })})</strong> <strong> (${new Date(orderData.created_at || Date.now()).toLocaleDateString('en-US', { month: 'long', day: 'numeric', year: 'numeric' })})</strong>
</p> </p>
</td> </td>
@ -219,19 +216,30 @@ const sendEmailWithAttachment = async (toEmail, orderData, pdfBuffer) => {
</html> </html>
`; `;
// Build attachments array - always include PDF, add logo as CID inline if it exists
const attachments = [
{
filename: `Invoice_${orderNumber}.pdf`,
content: pdfBuffer,
contentType: 'application/pdf'
}
];
if (logoExists) {
attachments.push({
filename: 'logo.png',
path: localLogoPath,
cid: 'store_logo' // Referenced in HTML as src="cid:store_logo"
});
}
const mailOptions = { const mailOptions = {
from: `"${process.env.SHOP_NAME || 'Your Store'}" <${process.env.SMTP_FROM_EMAIL}>`, from: `"${process.env.SHOP_NAME || 'Your Store'}" <${process.env.SMTP_FROM_EMAIL}>`,
to: toEmail, to: toEmail,
subject: `Invoice for your order #${orderNumber}`, subject: `Invoice for your order #${orderNumber}`,
text: `Thank you for your order! Attached is the invoice for order #${orderNumber}.`, text: `Thank you for your order! Attached is the invoice for order #${orderNumber}.`,
html: htmlTemplate, html: htmlTemplate,
attachments: [ attachments
{
filename: `Invoice_${orderNumber}.pdf`,
content: pdfBuffer,
contentType: 'application/pdf'
}
]
}; };
try { try {