Как сохранить изображение из тэга IMG?
Мне нужно получить эту картинку. Но проблема заключается в том, что она генерируется абсолютно случайно (Даже с ?rand). Какими средствами JS можно вытянуть эту картинку из DOM, а не делать запрос на сервер за картинкой?
Отслеживать
задан 29 окт 2020 в 20:41
user344683 user344683
1 ответ 1
Сортировка: Сброс на вариант по умолчанию
const img = document.getElementById('imgid') img.onload = function() < const canvas = document.createElement('canvas') canvas.width = img.width canvas.height = img.height const ctx = canvas.getContext("2d"); ctx.drawImage(img, 0, 0); const base64 = canvas.toDataURL("image/png") >В «base64» будет ваша картинка закодированная в base64. Формат можно поменять, например «image/jpeg». Если хотите ее скачать ну можно например так:
const a = document.createElement("a"); a.href = "data:application/octet-stream;base64," + base64; a.download = "imageName.png" a.click(); А вообще скачать можно и без канваса:
const img = document.getElementById('imgid') img.onload = function()
Добавление картинок
Установил путь к рисунку как /images/pic.gif, но рисунок не отображается на веб-странице. Почему?
Слэш (символ /) перед именем файла или папки обозначает, что отсчет ведется от корня сайта. Соответственно, путь /images/pic.gif следует понимать так. В корне сайта находится папка с именем images, а в ней располагается файл pic.gif. Данный способ записи работает под управлением веб-сервера, поэтому на локальном компьютере браузер интерпретирует путь как c:/images/pic.gif , а такой папки и файла, вероятнее всего, нет (пример 1).
Почему изображения на странице видны только на моем компьютере и не отображаются на другом?
При добавлении картинок с помощью программ для редактирования HTML-документа, программы нередко указывают локальный путь к графическому файлу, который начинается с ключевого слова file:/// . Например, рисунок находится по адресу c:\www\images\sample.gif , тогда путь к нему будет записываться как file:///c:/www/images/sample.gif . Браузер при открытии документа просматривает путь и ищет по указанному адресу изображение. Естественно, на соседнем компьютере указанной папки, скорее всего, нет, как нет и запрашиваемого файла, поэтому рисунок не отображается.
Почему изображение не показывается на сайте?
При тестировании веб-страницы на локальном компьютере все изображения обычно показываются корректно, однако после публикации на сайте возникает ситуация, что рисунки не видны. Это может происходить по ряду причин, рассмотренных далее.
Как добавить картинку на веб-страницу?
Для добавления изображения в документ применяется тег , его атрибут src определяет путь к графическому файлу, который должен быть в формате GIF, PNG или JPEG. Также для тега
необходимо указать обязательный атрибут alt , он описывает альтернативный текст, видимый при загрузке изображения или отключении картинок в браузере.
Как сохранить сайт картинкой?
Задача такая. Сохранить сайт на пк в виде картинки. Гуглил это дело но выпадают только способы сохранения видимой части или pdf файла. Нужна прям картинка jpg с нужным мне разрешением к примеру 1280. Встречались ли вам такие сервисы?
- Вопрос задан более трёх лет назад
- 18787 просмотров
Комментировать
Решения вопроса 1
Aleks Front @AleksFront
Frontend Developer
joxi.ru установить плагин для браузера. Можно делать как область сайта так и всю страничку.
Ответ написан более трёх лет назад
Сохранение документа в виде веб-страницы (.htm файл)
Visio, план 2 Visio профессиональный 2021 Visio стандартный 2021 Visio профессиональный 2019 Visio стандартный 2019 Visio профессиональный 2016 Visio стандартный 2016 Visio профессиональный 2013 Visio 2013 Visio премиум 2010 Visio 2010 Visio стандартный 2010 Еще. Меньше
- Откройте вкладку Файл.
- Выберите команду Сохранить как.
- В диалоговом окне Сохранить как в списке Тип файла щелкните Веб-страница (*.htm; *.html).
- Чтобы указать заголовок, который будет отображаться в строке заголовка при отображении страницы в браузере, нажмите кнопку Изменить заголовок. В поле Заголовок страницы введите заголовок и нажмите кнопку ОК.
- Чтобы точнее указать атрибуты веб-страницы, нажмите кнопку Опубликовать.
- В диалоговом окне Сохранить как веб-страницу перейдите на вкладку Общие , чтобы указать страницы документа для публикации и другие параметры отображения. Дополнительные сведения см. в разделе Общие параметры ниже.
- Перейдите на вкладку Дополнительно , чтобы указать формат выходных данных для веб-страницы, разрешение целевого монитора, веб-страницу узла для внедрения сохраненной веб-страницы и другие параметры. Дополнительные сведения см. в разделе Дополнительные параметры ниже.
Сохранить как веб-страницу: общие параметры
Публикуемые страницы
Вы можете сохранить все страницы на схеме или только указанный диапазон страниц.
Примечание: Фоновые страницы недоступны как отдельные страницы в при сохранении документа в качестве веб-страницы.
Параметры публикации
Указывает другие функции, которые будут включены на веб-страницу.
Подробности
Выберите этот параметр, чтобы отобразить данные фигур, которые пользователи могут просматривать, нажав клавиши CTRL при щелчке фигуры на веб-странице.
Примечание: Этот параметр поддерживается для форматов выходных данных VML, JPG, GIF и PNG в Internet Обозреватель 5.0 и более поздних версий. Элемент управления Сведения недоступен для выходных данных SVG.
Перейти к странице
Выберите, чтобы отобразить элемент навигации Перейти к странице для перемещения между страницами и отчетами в документе.
Страницы поиска
Выберите, чтобы отобразить элемент управления Страницы поиска , который можно использовать для поиска фигур на основе их имени, текста фигуры или данных фигуры.
Примечание: Для этого параметра требуется Интернет Обозреватель 5.0 или более поздней версии.
Сдвиг и масштабирование
Выберите , чтобы отобразить окно сдвига и масштабирования , которое можно использовать для быстрого увеличения разделов документа в окне браузера.
Примечание: Элемент управления Панорамирование и масштаб поддерживается для формата вывода VML в Интернете Обозреватель 5.0 или более поздней версии. Элемент управления Панорамирование и масштабирование недоступен для форматов вывода SVG, JPG, GIF и PNG.
Выберите, чтобы отобразить отчеты, доступные для документа.
Примечание: Если при сохранении веб-страницы выбрать отчет в качестве параметра публикации, Visio попытается создать этот отчет. Однако если никакие фигуры в документе не соответствуют требованиям к запросу отчета, отчет невозможно создать. В результате веб-страница создается без отчета.
Дополнительные возможности
Выберите Автоматически открывать веб-страницу в браузере , если вы хотите открыть сохраненную веб-страницу в браузере по умолчанию сразу после сохранения веб-страницы.
Команда Упорядочить вспомогательные файлы в папке создает вложенную папку с именем, которая содержит имя корневой папки HTML-файла, в которой хранятся вспомогательные файлы для веб-страницы.
Используйте поле Заголовок страницы , чтобы определить заголовок веб-страницы, который будет отображаться в строке заголовка веб-браузера. По умолчанию используется имя файла. Это имя можно изменить.
Сохранить как веб-страницу: дополнительные параметры
Используйте это диалоговое окно для указания форматов вывода, разрешения целевого монитора, таблиц стилей или файлов узла для внедрения веб-страницы.
Форматы выходных данных
Список форматов выходных данных
Задает формат выходных данных для веб-страницы: SVG, JPG, GIF, PNG или VML.
Так как SVG и VML являются масштабируемыми графическими форматами, при изменении размера окна браузера выходные данные веб-страницы также будут изменяться.
При выборе формата, например VML или SVG, для которых требуется относительно новый браузер, появится поле Предоставить альтернативный формат для старых браузеров проверка.
Предоставление альтернативного формата для старых браузеров
Указывает альтернативный формат (GIF, JPG или PNG), когда страница отображается в более старом браузере.
Если выбрано это поле проверка, в раскрывающемся списке перечислены форматы выходных данных, поддерживаемые всеми браузерами, поддерживаемыми Visio. Когда пользователи с более старыми браузерами просматривают веб-страницу, используется выбранный альтернативный формат выходных данных.
Примечание: Этот вариант выбран по умолчанию. Рекомендуется оставить этот параметр выбранным, чтобы использовать самый широкий диапазон веб-браузеров.
Параметры отображения
Конечный монитор.
Указывает размер рисунка, созданного для веб-страницы, в зависимости от разрешения экрана монитора или устройства, на котором ожидается, что большинство пользователей будут просматривать веб-страницу. Размер рисунка веб-страницы соответствует окну браузера для целевого разрешения экрана.
Выберите размер монитора, соответствующий наименьшему разрешению для систем, в которых пользователи будут просматривать веб-страницы. Например, можно указать разрешение 180 x 260 для веб-страниц, которые будут просматриваться на карманном компьютере.
Примечание: Этот параметр доступен только для форматов GIF, JPG и PNG. Этот параметр не требуется для SVG и VML, так как они масштабируются.
Размещение на веб-странице
Указывает веб-страницу, в которую необходимо внедрить сохраненную веб-страницу Visio.
Чтобы отобразить веб-страницу Visio, необходимо вставить следующий HTML-тег на хост-страницу:
Примечание: Параметр «Узел на веб-странице» для веб-страниц Visio работает только с браузерами, поддерживающими тег>
Таблица стилей
Задает таблицу стилей со стилями цветовых схем для левого фрейма и страниц отчета в файле веб-страницы Visio, которые соответствуют цветовой схеме, доступной в Visio. Если вы сохраняете рисунок, к которому применена определенная цветовая схема, можно сопоставить эту схему, выбрав здесь таблицу стилей с тем же именем.