Как запретить Gmail изменять URL-адреса изображений в HTML-почте?

Я работаю над порталом управления событиями, используя Django, и я отправляю письмо с подтверждением при регистрации пользователя. В письмо включено изображение шапки. Однако при получении письма в Gmail URL-адрес изображения изменяется, что вызывает проблемы с рендерингом.

Вот соответствующая часть моего кода:

def view_registration_form(request, event_id, event_name):
event = get_object_or_404(Event, id=event_id, name=event_name)
form_template = get_object_or_404(FormTemplate, event=event)

view_only = 'view' in request.path

if request.method == 'POST' and not view_only:
    response_data = {field.label: request.POST.get(f'field-{field.id}', '') for field in form_template.fields.all()}
    email = next((value for key, value in response_data.items() if '@' in value), None)
    # Save the form response
    print(email)
    FormResponse.objects.create(form=form_template, email=email, response_data=response_data)

    # Send confirmation email using the event's email configuration
    email_config = EmailNotification.objects.filter(event=event, email_type='confirmation').first()
    if email_config and email:
        ngrok_url = 'https://######.ngrok-free.app'  # Replace with your ngrok URL
        masthead_url = f"{ngrok_url}{email_config.masthead.url}"
        html_message = f"""
            <html>
                <head>
                    <style>
                        .email-masthead img {{
                            width: 100%;
                            height: auto;
                        }}
                        .email-footer {{
                            margin-top: 20px;
                            font-size: 0.9em;
                            color: #555;
                        }}
                    </style>
                </head>
                <body>
                    <div class="email-masthead">
                        <img src="{masthead_url}" alt="Email Masthead">
                    </div>
                    <div class="email-body">
                        {email_config.message}
                    </div>
                    <div class="email-footer">
                        {email_config.footer}
                    </div>
                </body>
            </html>
        """
        print(html_message)  
        send_mail(
            email_config.subject,
            email_config.message,
            'from@example.com',  
            [email],
            fail_silently=False,
            html_message=html_message
        )

    return JsonResponse({'status': 'success', 'message': 'Thank you for registering!'})

fields = [{
    'id': field.id,
    'label': field.label,
    'field_type': field.field_type,
    'required': field.required,
    'properties': field.properties,
    'options': field.properties.get('options', []) if field.field_type in ['select', 'choice'] else None,
} for field in form_template.fields.all()]

context = {
    'event': event,
    'form_template': form_template,
    'fields': fields,
    'view_only': view_only,
}
return render(request, 'main/view_registration_form.html', context)

Когда письмо получено в Gmail, URL-адрес изображения выглядит следующим образом:

<img src="https://ci3.googleusercontent.com/meips/ADKq_NbcRVtKX8-MU89n76291vvMOgc0-_OZNXq11ShmRpXV8rhSgqmfS-RQbZyl9dYGE1JdpPAVi53QGZ3qs3xaq9e9g52ESafSbgZwFfb_k1TexoAJjgoXW-pXuoJ_H8QeiToEMQwviLadIC9n7_oPbJePcHTQPvTNS_RJl7xqBeeIcvkO9o5_3EU1-Lf0ttswGRuxMh9GzFd9w452ZfXOiWaDjQ=s0-d-e1-ft#https://########.ngrok-free.app/media/email_mastheads/fcac3fdb-af68-4dcb-9f1a-84d0b4ed86d5_2087ZhZ.jpeg" alt="Email Masthead">

Вместо этого я хочу, чтобы URL выглядел следующим образом, чтобы изображение отображалось правильно:

<img src="https://##########.ngrok-free.app/media/email_mastheads/fcac3fdb-af68-4dcb-9f1a-84d0b4ed86d5_2087ZhZ.jpeg" alt="Email Masthead">

Похоже, что Gmail изменяет URL-адрес изображения в целях безопасности. Как сделать так, чтобы URL-адрес изображения оставался нетронутым и изображение корректно отображалось в Gmail? Существуют ли лучшие практики встраивания изображений в HTML-письма, чтобы избежать этой проблемы?

Любой совет или решение будут очень признательны!

Вернуться на верх