«Запечь» картинки в html файле

Расширение Single File, читать тему здесь

Картинки при конвертации в base64 сильно пухнут, подумой об этом

Можно же сжимать base64 в zstd.
Декодер на JS ~8kB.

Pandoc такое помнится умел.

Делается разметка в Markdown и там же вставляются картинки, затем Pandoc’ом генерится standalone HTML

SingleFile я уже пробовал, оно мне пустоту в полях src нагенерило. Остальные рецепты из ветки буду осмыслять, спасибо за наводку!

я ж не сканы Рембрандта эмбедить собираюсь)

Уж думал. Да, мне это точно надо)

https://ru.wikipedia.org/wiki/MHTML - не?

не, надо именно хтмл, без никаких м

А в чем изначальная задача состоит? Может, её можно решить другим способом?

Это и есть моя изначальная задача - одна автономная страница со вшитыми картинками. Можно и подвинуть условия. Можно многое. Можно вообще забить. Но сейчас актуально именно это.

Хммм...

Делается разметка в Markdown и там же вставляются картинки

А просто импорт этой разметки из хтмл оно может есть, интересно?

Спасибо за наводку, покурю этот pandoc...

MHT/MAFF. Первая разновидность, кстати, редчайший пример случая того, как Microsoft сделал свой формат, но сделал его полностью на основе открытых, понятных структур данных, не лепя никаких противоестественных велосипедов. Вторая разновидность – детище Мозиллы.

Почему современные браузеры не хотят в это сохранять – для меня загадка.

Так зачем это нужно? Чтобы проще поставку сделать клиенту? Как это файл планируется открывать?

А тебя башскрипт чем не устраивает?

Я бы такое в браузере заблочил.

не надо изобретать .PDF

использую формат MHTML большинство бравзеров его поддерживает. внутренности просты и логичны.

перед сохранение запускаю встроенный в бравзер инструмент разработчика и вырезаю все script к дизайнерам в ж…
также по интересу чищу интерфейс от понтов и рекламы.
получается маленький эффективный аккуратный файл.

как вариант, можешь конвертнуть в пдф

Каких javascript упаковщиков глянуть может. Ну если совсем нужно, можно все встроить в док как данные, и отрисовывать в canvas. Оверкил имхо.

CanvasRenderingContext2D: createImageData() method

Это нерешаемая в общем случае задача. img src может заменяться скриптами. Можно разве что сделать «скриншот», снять копию DOM, и в неё зашить картинки без скриптов.

Меня интересует способ отвязать эту страницу от папки, преобразовав ссылки на картинки в прямые их base64-описания. Всё, что находил по теме - либо не работает, либо не то.

Что именно не работает? https://ru.wikipedia.org/wiki/Data:_URL

Попробуй

• https://gitflic.ru/project/blogdron/pagepack

На коленке, но вроде работает. Сохранил эту страницу через firefox с ресурсами, эту страницу передал утилитке, на выходе комбинированная страница с встроенными картинками, размер увеличился раз в 6

Рекламные картинки не присобачились, и глазика нет

• https://i.ibb.co/fdBR5dc2/2025-06-22-22-34-08.png

Как-то так. Самый минимум делает, с остальным разбираться пока не хоца, потом может

можно написать в разы короче на base64/sed/bash, кому надо пусть и пишут хехе

Отлично, например! Спасибо!

попроси дикпик написать с requests и beautiful soup. чтобы все js скрипты склеивал и вставлял как inline, так же стили, а картинуи заменял на data:base64. можно еще через headless chrome готовый html получать, тогда не нужно будет js подключать и все теги script можно будет вырезать лишь стили осиавить и картинки заменить

Почему современные браузеры не хотят в это сохранять – для меня загадка.

Меньше кода - проще править.

Google Chrome как раз в MHTML сохраняет по выбору.

mhtml это аккурат про «меньше кода» :) ибо mhtml по своей сути представляет собой html c multi-part вложениями картинок.

Распечатай в pdf, а потом pdf2htmlEX

Преимущество простого html в том, что даже netsurf и dillo его открывают. :)

И куда эти пожатые бинарники девать? Автору нужен ведь инлайн.

По мере надобности, доработалось немного, теперь ещё и «само» может через curl вытягивать, а не только собирать блоб из того что скачал браузер. Теперь может впихивать в 1 файл

• css-стили (как есть)
• скрипты (как есть)
• изображения (base64 кодирование, в том числе из внешних CSS)
• шрифты (base64 кодирование, в том числе из внешних CSS)
• видео (base64 кодирование)
• аудио (base64 кодирование)

Можно отключать ненужное ключами, отключается только то что по ссылкам, уже изначально встроенное в страницу не исключается.
Утилита как была кривой, так и осталась. Но работает и ладно.

По умолчанию сначала пробует дёрнуть локальный файл, если нету, то лезет в сеть за ним, можно этот порядок поменять (или запретить скачку или/и локальные файлы). Даже если скачать браузером например, тот не скачает реально всё что надо, а ссылки в css например оставит, а там могут быть картинки и например стилизованные шрифты.

Так как некоторые страницы хитрые и их попытка скачать просто через pagepack приводит к кривости, то идеальный вариант, это скачать страницу с ресурсами браузером, а потом скормить её pagepack тот соберёт все файлы что есть в блоб, и ещё сам попутно докачает то что не докачал браузер.

Но для строгих и классических веб страничек типа ЛОРа, можно тупо скармливать ссылку.

P.S. Ой, я что-то сломал… P.P.S А не, всё нормально, утилита же кривая, пойдёт.