Проблема с отображением картинки baseimage64 в gmail

@flyten · Регистрация: 03.03.2021

Студворк — интернет-сервис помощи студентам

Всем Доброго вечера,

Не могу понять, почему в письме gmail не отображается конвертированная картинка imagebase64 .
В отличии от gmail, outlook и другие почтовые клиенты отображают imagebase64

Еще гуглил эту проблем, но все что мог найти, это решение проблемы установкой nodemailer-plugin-inline-base64 .Но что то я не могу понять как его применить в коде

testCreated.ts

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
import { track } from "../../base64Images";
 
 
let html = `
      
        <p style="color:black">
        Test 
        </p>
   
 
      <img src= ${track}  />
 
      
        `;

base64Images.ts :

JavaScript
1
export const track = "data:image/png;base64,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"

@flyten · 09.04.2021, 17:09 **[ТС]**

Anybody?

@muxahuk1214 · 10.04.2021, 00:25

Не по теме:

не совсем понятно при чём тут реакт..

судя по этому ответу всё работает https://support.google.com/mai... 7591?hl=en

где-то в нете пишут что для правильного отображения картинок в gmail их нужно добавлять в аттачменты и ссылатся на атачмент в img src https://stackoverflow.com/ques... 64#9110164 что-то типо такого, но это сервер, а не реакт может сделать...

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами 8Observer8 20.02.2026 Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .	Конвертировать закладки radiotray-ng в m3u-плейлист damix 19.02.2026 Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .	Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI Eddy_Em 18.02.2026 Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»	SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .

@flyten 0 / 0 / 0 Регистрация: 03.03.2021 Сообщений: 23
	09.04.2021, 17:09 [ТС]
	Anybody? 0

@muxahuk1214 Coding is art 540 / 423 / 154 Регистрация: 04.09.2013 Сообщений: 1,066
	10.04.2021, 00:25
	Не по теме: не совсем понятно при чём тут реакт.. судя по этому ответу всё работает https://support.google.com/mai... 7591?hl=en где-то в нете пишут что для правильного отображения картинок в gmail их нужно добавлять в аттачменты и ссылатся на атачмент в img src https://stackoverflow.com/ques... 64#9110164 что-то типо такого, но это сервер, а не реакт может сделать... 0