update one-click-apps/headless-chrome/selenium page

liara-cloud · Feb 15, 2024 · 21f4c66 · 21f4c66
1 parent 13b43fe
commit 21f4c66
Showing 1 changed file with 104 additions and 29 deletions.
diff --git a/pages/one-click-apps/headless-chrome/selenium.js b/pages/one-click-apps/headless-chrome/selenium.js
@@ -19,57 +19,132 @@ export default () => (
       </div>
     </div>
     <p>
-      برای اتصال از طریق وب درایور Selenium به برنامه‌ی Headless Chrome باید
-      تغییری در کدهای قبلی خود ایجاد کنیم. برای مثال قطعه کد زیر را درنظر بگیرید
-      که ما با استفاده از آن مرورگر Chrome را برای انجام کارهای مورد نیاز خود
-      راه‌اندازی می‌کردیم:
+      سلنیوم، یک ابزار قدرتمند و متن‌بازِ تست خودکار است که برای آزمایش
+      برنامه‌های تحت وب به کار می‌رود. شما می‌توانید با استفاده از این ابزار
+      بی‌نظیر، ربات خود را در Headless Chrome راه‌اندازی کنید.
     </p>
+    <ul>
+      <li>
+        <a href="#nodejs">
+          اتصال به Headless Chrome با کتابخانه Selenium در NodeJS
+        </a>
+      </li>
 
-    <Highlight className="javascript">
-      {`const webdriver = require('selenium-webdriver');
+      <li>
+        <a href="#python">
+          اتصال به Headless Chrome با کتابخانه Selenium در Python
+        </a>{" "}
+      </li>
+    </ul>
 
-const chromeCapabilities = webdriver.Capabilities.chrome();
-chromeCapabilities.set('goog:chromeOptions', {
-    // Set args similar to puppeteer's for best performance
-    args: [
-      '--headless',
-      '--no-sandbox',
-    ],
-});
-
-const driver = new webdriver.Builder()
-  .forBrowser('chrome')
-  .withCapabilities(chromeCapabilities)
-  .build();`}
+    <h2 id="nodejs">اتصال به Headless Chrome با کتابخانه Selenium در NodeJS</h2>
+    <p>
+      در ابتدا، برای استفاده از کتابخانه Selenium، شما بایستی آن را با استفاده
+      از npm نصب کنید:
+    </p>
+    <Highlight className="javascript">
+      {`npm install selenium-webdriver`}
     </Highlight>
     <p>
-      اما شما برای انجام این کار در لیارا باید به شکل زیر به برنامه‌ی Headless
-      Chrome خود متصل شوید:
+      اکنون می‌توانید با استفاده از قطعه کد زیر، به Headless Chrome متصل شده و
+      با استفاده از کتابخانه Selenium، کارهای مد نظر خود را انجام دهید. برای
+      نمونه، قطعه کد زیر یک اسکرین‌شات از سایت داده شده می‌گیرد و آن را در پوشه{" "}
+      <span className="code">uploads</span> ذخیره می‌کند:
     </p>
     <Highlight className="javascript">
       {`const webdriver = require('selenium-webdriver');
+const fs = require('fs');
 
 const chromeCapabilities = webdriver.Capabilities.chrome();
-chromeCapabilities.set('browserless:token', '<your-env-token>');
+chromeCapabilities.set('browserless:token', 'YOUR-API-TOKEN');
 chromeCapabilities.set('goog:chromeOptions', {
-    args: [
-      '--headless',
-      '--no-sandbox',
-    ],
+  args: [
+    '--disable-background-timer-throttling',
+    '--disable-backgrounding-occluded-windows',
+    '--disable-breakpad',
+    '--disable-component-extensions-with-background-pages',
+    '--disable-dev-shm-usage',
+    '--disable-extensions',
+    '--disable-features=TranslateUI,BlinkGenPropertyTrees',
+    '--disable-ipc-flooding-protection',
+    '--disable-renderer-backgrounding',
+    '--enable-features=NetworkService,NetworkServiceInProcess',
+    '--force-color-profile=srgb',
+    '--hide-scrollbars',
+    '--metrics-recording-only',
+    '--mute-audio',
+    '--headless',
+    '--no-sandbox',
+  ],
 });
 
 const driver = new webdriver.Builder()
   .forBrowser('chrome')
   .withCapabilities(chromeCapabilities)
-  .usingServer('https://<liara-chrome-app-url>/webdriver')
+  // Specify browserless for the server
+  .usingServer('https://YOUR-LIARA-ADDRESS.liara.run/webdriver')
   .build();
-`}
+
+(async () => {
+  try {
+    await driver.get('https://www.google.com/');
+
+    // Take screenshot of results page. Save to disk.
+    const base64png = await driver.takeScreenshot();
+    fs.writeFileSync('uploads/screenshot.png', new Buffer(base64png, 'base64'));
+  } finally {
+    driver.quit();
+  }
+})();`}
     </Highlight>
+    <p>
+      توجه کنید که در قطعه کد بالا به جای{" "}
+      <span className="code">YOUR-API-TOKEN</span> و{" "}
+      <span className="code">YOUR-LIARA-ADDRESS</span> باید به ترتیب token و
+      شناسه برنامه Headless Chrome خود را بگذارید. برای دسترسی به token کافیست
+      وارد قسمت تنظیمات برنامه Headless Chrome خود شوید و مقدار متغیر محیطی{" "}
+      <span className="code">TOKEN</span> همان token شما خواهد بود.
+    </p>
+    <h2 id="python">اتصال به Headless Chrome با کتابخانه Selenium در Python</h2>
+    <p>
+      در ابتدا، برای استفاده از کتابخانه Selenium، شما بایستی آن را با استفاده
+      از pip نصب کنید:
+    </p>
+    <Highlight className="python">{`pip install selenium`}</Highlight>
+    <p>
+      اکنون می‌توانید با استفاده از قطعه کد زیر، به Headless Chrome متصل شده و
+      با استفاده از کتابخانه Selenium، کارهای مد نظر خود را انجام دهید. برای
+      نمونه، قطعه کد زیر Title سایت داده شده را می‌گیرد و آن را پرینت می‌کند:
+    </p>
+    <Highlight className="javascript">
+      {`from selenium import webdriver
+
+chrome_options = webdriver.ChromeOptions()
+chrome_options.set_capability('browserless:token', 'YOUR-API-TOKEN')
+chrome_options.add_argument("--no-sandbox")
+chrome_options.add_argument("--headless")
+
+driver = webdriver.Remote(
+    command_executor='https://YOUR-LIARA-ADDRESS.liara.run/webdriver',
+    options=chrome_options
+)
 
+driver.get("https://www.google.com")
+print(driver.title)
+driver.quit()`}
+    </Highlight>
+    <p>
+      توجه کنید که در قطعه کد بالا به جای{" "}
+      <span className="code">YOUR-API-TOKEN</span> و{" "}
+      <span className="code">YOUR-LIARA-ADDRESS</span> باید به ترتیب token و
+      شناسه برنامه Headless Chrome خود را بگذارید. برای دسترسی به token کافیست
+      وارد قسمت تنظیمات برنامه Headless Chrome خود شوید و مقدار متغیر محیطی{" "}
+      <span className="code">TOKEN</span> همان token شما خواهد بود.
+    </p>
     <Notice variant="info">
       شما برای{" "}
       <a href="/one-click-apps/headless-chrome/tips#add-token">اتصال ایمن</a> به
-      برنامه‌ی Headless Chrome خود به یک توکن نیاز خواهید داشت که می‌توانید
+      برنامه‌ی Headless Chrome خود به یک توکن جدید نیاز خواهید داشت که می‌توانید
       آموزش اضافه کردن آن را در صفحه‌ی توضیحات و نکات تکمیلی مشاهده کنید.
     </Notice>
   </Layout>