Інколи немає необхідності зберігати скриншот цілого вікна браузера чи цілої сторінки – він може мати великий розмір, і роблячи багато таких збережень місце на диску має властивість швидко закінчуватись. Крім того, скриншот конкретного елемента необхідний коли потрібно зберегти captcha чи наприклад номер телефону, який згенерований на сторінці за допомогою JavaScript і не копіюється іншим способом.
Сам процес збереження скриншота складається з декількох кроків:
– підготовка шляху для збереження зображення
– пошук необхідного HTML елемента на сторінці
– перетворення HTML елемента в зображення base64
– перетворення base64 в масив байт
– перетворення масиву байт в зображення
– збереження зображення у вигляді файлу
Щоб користувачам було простіше, розробники ZennoLab ввели модуль CaptchaSaver.dll якому можна передати рядок base64 і шлях до файлу, в який потрібно зберегти зображення. Скористатись цим функціоналом також просто – потрібно клікнути по елементу правою кнопкою мишки і в контекстному меню вибрати пункт Це каптча. Після чого вказати модуль CaptchaSaver.dll. Про це я розказував у відео:
var he = instance.ActiveTab.FindElementById("zp_fr_hl_top_hl"); // шукаємо потрібний HTML елемент, наприклад по ID чи xPath
ZennoPoster.CaptchaRecognition("CaptchaSaver.dll", he.DrawToBitmap(false), "C:\\image.jpg"); // якщо елемент не картинка
ZennoPoster.CaptchaRecognition("CaptchaSaver.dll", he.DrawToBitmap(true), "C:\\image.jpg"); // якщо елемент картинка
Але інколи буває так, що немає необхідності зберігати зображення в файл, чи хочеться спочатку перед збереженням змінити його – наприклад всі темні кольори замалювати в чорний колір, а всі світлі – в білий, чи наприклад видалити якісь елементи з зображення, чи навпаки прицепити зверху логотип. Тому потрібно вміти виконувати всі кроки окремо – і на будь-якому кроці ми можемо вмішатись своєю логікою і внести необхідні зміни. Ось в цьому відео я показую як HTML елемент переводиться в текстовий рядок base64:
Ось власне така інструкція зробить із HTML елемента рядок base64:
string base64 = he.DrawToBitmap(false);
Тепер можна перевести base64 в масив байт:
byte[] newBytes = Convert.FromBase64String(base64);
Потім цей масив байт переводимо в зображення і зберігаємо в файл.
var bitmap = new Bitmap(new MemoryStream(newBytes)); // Масив байт у картинку Bitmap
bitmap.Save("C:\\image.png", System.Drawing.Imaging.ImageFormat.Png); // Збереження в файл в указаному форматі
bitmap.Dispose();
Про це я також уже розказував у відео:
var he = instance.ActiveTab.FindElementById("zp_fr_hl_top_hl"); // шукаємо потрібний HTML елемент, наприклад по ID чи xPath
string path ="C:\\image.png"; // шлях до зображення
string base64 = he.DrawToBitmap(false); // Одержуємо base64 з HtmlElement
byte[] newBytes = Convert.FromBase64String(base64); // base64 переводимо в байти
var bitmap = new Bitmap(new MemoryStream(newBytes)); // Одержані байти переводимо в картинку Bitmap
bitmap.Save(path, System.Drawing.Imaging.ImageFormat.Png); // Bitmap зберігаємо у файл вказавши формат
bitmap.Dispose(); // звільняємо оперативну пам'ять
Власне, як бачимо це просте завдання, хоча потрібно по кроках самостійно розібратись з тим, що за чим відбувається і як самостійно будувати подібну логіку. Якщо досвіду мало – попробуйте самостійно зберегти декілька HTML элементів, подивіться що получається в результаті. Після чого можна сміло ставити собі галочку про те, що вмієте робити скриншоти HTML елементів – а це базовий навик при роботі з різного роду captcha, за вирішенням яких в основному і звертаються замовники.