Инструменты для захвата и конвертирования Интернета

Как сделать скриншот веб-страницы вашего пользователя в JavaScript

Вы когда-нибудь хотели сделать снимок экрана веб-страницы пользователя? Возможно, чтобы упростить исправление ошибок или intулучшения интерфейса? Ну, ты можешь с JavaScript API GrabzIt.

Чтобы захватить страницу пользователя, вы должны использовать ConvertPage метод. Содержимое страницы пользователя будет отправлено нам для преобразования. intoa, PDF, DOCX или что-либо еще, что мы поддерживаем. Важно помнить, что любые ресурсы, такие как CSS или изображения, не могут быть загружены, кроме как на снимке экрана, если они не доступны публично. Однако обычно это так.

Простой пример ниже показывает, как легко сделать снимок экрана веб-страницы пользователя с помощью библиотеки GrabzIt. Просто разместите код внизу страницы, которую хотите захватить.

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@3.5.2/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertPage().Create();
</script>

Обратите внимание, что вы можете передать любой параметры позволяет с помощью API JavaScript ConvertPage метод, чтобы дополнительно настроить снимок экрана. Например, в приведенном ниже примере мы делаем снимок экрана той же ширины, что и веб-страница пользователя, но сохраняя при этом его полную высоту.

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@3.5.2/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertPage({
   "bwidth":document.documentElement.clientWidth,
   "bheight": -1, 
   "height": -1,
   "width": -1
}).Create();
</script>

Однако приведенные выше примеры ограничены, поскольку вам нужно будет инициировать захват веб-страницы при каком-либо событии, а не только захват страницы при загрузке веб-страницы. Например, двумя потенциальными альтернативами могут быть либо захват веб-страницы одним нажатием кнопки, либо регулярный захват. intервал с таймером.

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@3.5.2/grabzit.min.js"></script>
<script>
setTimeout(function(){
   GrabzIt("Sign in to view your Application Key").ConvertPage({
      "bwidth":document.documentElement.clientWidth,
      "bheight": -1, 
      "height": -1,
      "width": -1
   }).CreateInvisible();
}, 30000);
</script>

В приведенном выше примере мы автоматически создаем снимок экрана веб-страницы пользователя каждые 30 секунд. Но вместо того, чтобы добавлять снимок экрана на веб-страницу пользователя или загружать его, как Create В зависимости от формата подойдет метод, использованный в предыдущих примерах. CreateInvisible используется метод, который не возвращает результат пользователю.

После этого вы можете save скриншот JavaScript используя один из следующих методов. Параметр экспорта для экспорта результата в Amazon, Dropbox, FTP или другое. Или вы можете использовать событие завершения для вызова веб-службы для save результат или DataURI метод для публикации результата в веб-службе.

Очевидно, само собой разумеется, что вам, вероятно, придется сообщить своим пользователям, что вы делаете это.

Вы можете бесплатно сделать снимок экрана текущей веб-страницы, выполнив создание учетной записи и скопировав приведенный выше код intoa веб-страница, которую вы хотите захватить. Помните, что для того, чтобы другие люди не использовали вашу учетную запись, вы должны авторизовать свой домен прежде чем он будет работать на вашем сайте.