Для разработчиков / HTML
HTML-просмотрщик: интерактивный предпросмотр с CSS и JavaScript в песочнице
Вставьте HTML и необязательный CSS, чтобы увидеть интерактивный предпросмотр в изоляции. Явно включите JavaScript, разверните предпросмотр на весь экран или скачайте файл HTML.
HTML-просмотрщик: интерактивный предпросмотр с CSS и JavaScript в песочнице: Исходный код отображается в изолированном фрейме с непрозрачным origin. Скрипты по умолчанию отключены. Политика безопасности контента блокирует внешние ресурсы, запросы fetch, формы и встроенные страницы, но разрешает встроенные стили и изображения через data URL. Удаляются метаданные, способные перезагрузить страницу, элементы base и встроенные контексты просмотра. Скачанный файл сохраняет изолированный фрейм. Работает на 100% локально в вашем браузере, файлы на сервер не загружаются.
- Категория
- Инструменты для разработчиков
- Запуски
- В вашем браузере
- Стоимость
- Бесплатно · без регистрации
- Доступность
- Готово к использованию
Полностью работает в браузере
Предварительный просмотр изолирован от этого сайта. Скрипты по умолчанию отключены. Внешние стили, скрипты, изображения, fetch-запросы, формы и встроенные страницы блокируются; встроенные стили и изображения данных разрешены. При включении скриптов выполняется код, который вы вставляете в предварительный просмотр.
Скачанный HTML открывает тот же изолированный предварительный просмотр. Исходный код не вставляется в эту страницу.
Изоляция фрейма
Стандарт WHATWG HTML определяет ограничения песочницы iframe (https://html.spec.whatwg.org/multipage/iframe-embed-object.html#attr-iframe-sandbox). Этот предварительный просмотр никогда не предоставляет allow-same-origin.
Ограничения содержимого
Спецификация W3C Content Security Policy определяет ограничения для ресурсов (https://www.w3.org/TR/CSP3/). Перед переданной разметкой предварительный просмотр применяет строгую политику. Скачиваемая оболочка сохраняет границу песочницы.
Как пользоваться
- Вставьте HTML и необязательный CSS или JavaScript.
- Включайте скрипты только в том случае, если хотите запустить вставленный код в изолированном предпросмотре.
- Проверьте предпросмотр в окне или на весь экран, затем скачайте файл предпросмотра в песочнице.
Конфиденциальность и ограничения
Введённые данные и файлы обрабатываются в вашем браузере. Ничего не загружается на сервер.
Похожие инструменты
Часто задаваемые вопросы
Может ли мой предпросмотр получить доступ к cookie или странице этого сайта?
Песочница не предоставляет доступ к тому же origin. Вставленный код не может читать DOM или хранилище этого сайта. Скрипты запускаются только после вашего включения.
Почему внешние изображения или библиотеки не загружаются?
Локальный предпросмотр блокирует удалённые ресурсы. Добавляйте стили и скрипты непосредственно в редакторы, а для изображений используйте data URL.
Можно ли вставить полный HTML-документ?
Да. Предпросмотр поддерживает полные документы и фрагменты. Он удаляет метаданные и встроенные контексты просмотра, применяет собственную политику безопасности контента и отображает результат в изолированном фрейме.
Что содержит скачанный файл?
Он содержит файл HTML, который открывает ваш исходный код внутри той же песочницы. Это файл предпросмотра, а не исходный код, напрямую вставленный в обычную страницу.
Бесплатный инструмент · запусков: в вашем браузере · аккаунт не нужен