مكتبة Playwright – بديل مايكروسوفت لأتمتة متصفحات الإنترنت

مكاتب بايثون Playwright لأتمتة الصفحات :

مكاتب بايثون بلايورايت : تنوعت أنشطة مايكروسوفت مؤخرًا فيما يخص دعم نظام تشغيل لينكس وعدد من المشاريع المفتوحة المصدر سواء كانت تمتلكها مثل  vscode،  أو التي لا تمتلكها، مثل لينكس بحد ذاته. ولكننا اليوم لدينا شيء جديد ومختلف، قد لا يكون مفتوح المصدر، ولكنه مجاني ويتمتع بالقوة بنفس الوقت. إنها مكتبة بايثون جديدة مقدمة من مايكروسوفت في أتمتة متصفحات الويب،  وتُعد هذه المكتبة الجديدة المنافس الحديث والأقوى لمكتبة سيلينيوم -والتي قد تتفوق عليها قريبا بجدارة.

نتحدث اليوم في بايثونات عن مكتبة جديدة وواعدة، إنها مكتبة بلايرايت  Playwright من مايكروسوفت.

أهلا بكم في مقال جديد، ومميز كالعادة من مدونة بايثونات، المدونة العربية الأولى المتخصصة في لغة البرمجة العظيمة بايثون.

أتاحت مايكروسوفت المكتبة للاستخدام عبر لغات عديدة مثل لغة البرمجة بايثون ولغة سي شارب ولغة جافا سكريبت. في هذا المقال، سنستخدم المكتبة من أجل تجريف بعض البيانات في موقع https://quotes.toscrape.com/js/، كما وسنستعرض بعض المزايا التي تقدمها المكتبة والتي تفيدنا في أتمتة عملية التجريف.

تثبيت المكتبة :

أولًا، لنثبت المكتبة :

ولذلك، أمامنا خياران، إما عن طريق pip  أو  pipenv. حتى نضرب عصفورين بحجر واحد، سنستخدم هذه المرة pipenv  لتنصيب المكتبة وفي نفس الوقت لعمل بيئة افتراضية معزولة. ننشئ مجلد جديد باسم مناسب، ومن ثم نقوم بالولوج إليه عبر سطر الأوامر ومن ثم نكتب الأمر التالي:

Pipenv shell

يقوم الأمر السابق بعمل بيئة افتراضية كاملة. نثبت المكتبات التالية لمشروعنا والتي من ضمنها مكتبة playwright:

Pipenv install playwright pandas

و بعد التنصيب نكتب الأمر التالي والذي يجب تنفيذه لمرة واحدة من أجل عمل المكتبة الجديدة playwright:

Playwright install

هذا الأمر سيقوم بتنصيب ملفات ومسوقات Drivers سنحتاجها للتحكم بالمتصفحات التي لدينا، سواء كانت كروميوم، فايرفوكس، أو متصفح ويب كيت.

تجريف صفحة جافا سكريبت :

سنجرف نسخة جافا سكريبت من الصفحة المستهدفة، والتي تقوم ديناميكيا بتوليد مكوناتها، وبالتالي يصعب تجريفها بالطريقة العادية عبر كتابة المحددات Selectors لمكونات الصفحة في HTML، لأنه وبكل بساطه لن تظهر للسكريبت.

هنا سنعمل على أتمته المتصفح، والذي سيرى شفرة الـ html كاملة ومن خلال ذلك سنجرف باستخدام xpath . لتعلم المزيد من لغة  xpath selectors يمكنك الإطلاع علي الرابط التالي:

من هنا

from playwright.sync_api import sync_playwright
import os
import pandas as pd

def main():
    # sync_playwright is a context manager type, so use the 'with'
    with sync_playwright() as p:
        # setting your script to run as an iphone device
        p.devices['iPhone 12 Pro']
        # by default the browser runs in the background, by setting headless= False
        # it will show on the screen
        browser = p.chromium.launch(headless=False)
        # creating a new page instance
        page = browser.new_page()
        # setting our custom headers for our browser on our iphone device
        page.set_content("{ userAgent: 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36' }")
       
        # فتح الصفحة المطلوبة
        page.goto('https://quotes.toscrape.com/js/')
       
        # تحديد وقت الإنتظار بالمللي ثانية
        page.wait_for_timeout(3000) # time in millisecs

        # طباعة عنوان الصفحة 
        print(page.title())

        # للحصول على الشفرة المصدرية للصفحة
        page_source = page.content() # page source


        #اعتبرنا أن كل قسم يحوي المقولة و باقي المعلومات كبطاقة
        # query_selecor_all() تقوم بجمع جميع البطاقات , query_selecor() ترجع فقط أول بطاقة
        #تقبل الدالة xpath أو css selectors بشكل أوتوماتيكي
        cards = page.query_selector_all("//div[@class='quote']")

        # قا~مة لجمع قواميس تحوي معلومات البطاقات
        data_list = []

        # الحصول على تفاصيل البطاقاتh
        # و جمعها في قواميس ثم اضافتها للقائمة
        for card in cards:

           data_list.append({
           "quote" :  card.query_selector("//span[@class='text']").inner_text(),
           "author" :  card.query_selector("//span/small[@class='author']").inner_text(),
           "tags" : (",").join([tag.inner_text() for tag in card.query_selector_all("//div[@class='tags']/a[@class='tag']")]),
           })
 
        # تحويل القائمة داتا فريم 
        df = pd.DataFrame(data_list)

        # طباعة الداتا فريم
        print(df)

        # اللعب لتجربة بعض المزايا الأخرى
        login = page.query_selector('//a[@href="/login"]').click() # clicking
        username  = page.query_selector('//input[@type="text"]').type('nasserooooo') # filling fields
        password = page.query_selector('//input[@type="password"]').type('passwooooorjjjjj')
        page.query_selector('//input[@type="submit"]').click()

        # saving our scraped data in a csv file
        df.to_csv('C:\\Users\\00106\\Desktop\\j_farah\\quotes_first_page.csv')

        page.wait_for_timeout(10000) # time in millisecs
        browser.close() # closing the browser



if __name__ == "__main__":
    os.system('cls')
    main()

من المميزات الجميلة في مكتبة playwright  أنها تتيح للمستخدم توليد شفرة برمجية لجميع اللغات التي تدعمها عن طريق تسجيل ما يقوم به المستخدم في المتصفح. في سطر الأوامر أكتب الأمر التالي وسيفتح لك متصفح من قبل المكتبة وكذلك صفحة الكود الذي يتم توليده في الوقت الحقيقي كلما تفاعلت مع المتصفح ومكونات الصفحة:

playwright.exe codegen www.pythonat.com

نلاحظ أنه كلما تفاعلنا مع الصفحة من حيث الضغط على أي شيء أو أدخال شيء ستقوم المكتبة بتسجيله ككود بايثون أو أي لغة تدعمها في محرر النصوص الجانبي كما في الصورة. أي أنه يقوم بتسجيل وكتابة ماكرو بشكل أوتوماتيكي كما في فوتوشوب.  جميل جدا أليس كذلك ؟

لنقم بمثال عملي آخر، لنكتب في سطر الأوامر التالي :

Playwright codegen

ستجد نافذتي المتصفح المحتكم به من قبل playwright ونافذة inspector والتي ستقوم بتسجيل تحركاتك وتفاعلك مع المتصفح الجديد وتحويلها إلى شفرة مصدرية يمكننا استخدامها والتعديل والإضافة عليها لعمل برنامج كامل.

و الآن في المتصفح الجديد إذهب لمدونتك المفضلة بايثونات وتجول فيها كما تشاء وشاهد  كيف تسجل المكتبة تفاعلك مع المتصفح بنجاح كشفرة مصدرية بلغة بايثون:

في شاشة inspector  يمكننا اختبار الـ selectors في مستطيل الإدخال فيه وكذلك عند نقر زر explore  ويمكننا تحديد أهم عناصر الصفحة باستخدام الفأرة.

في النهاية أعتقد أن هذه المكتبة هي بديل مُعتبر لمكتبة سيلينيوم من حيث سهولة الاستخدام والتعلم.

كما أنني وجدت أنها قد تغنيني عن العمل بمكتبة سيلينيوم ومكتبة requests-html.

على سبيل التغيير، انصح بتجربتها، وشاركونا رأيكم في التعليقات أو عبر منصات التواصل الاجتماعي.

اقرأ ايضاً دمج الأمن السيبراني في منظومة الأمن القومي