এই পৃষ্ঠাটি Cloud Translation API অনুবাদ করেছে।

মাথাবিহীন ক্রোম শেল

Eric Bidelman

ক্রোম ৫৯-এর সাথে হেডলেস ক্রোম শেল অন্তর্ভুক্ত করা হয়েছে। এটি একটি হেডলেস পরিবেশে ক্রোম ব্রাউজার চালানোর একটি উপায়। সহজ কথায়, ক্রোম ছাড়াই ক্রোম চালানো! এটি ক্রোমিয়াম এবং ব্লিংক রেন্ডারিং ইঞ্জিন দ্বারা প্রদত্ত সমস্ত আধুনিক ওয়েব প্ল্যাটফর্মের বৈশিষ্ট্য কমান্ড লাইনে নিয়ে আসে।

স্বয়ংক্রিয় টেস্টিং এবং সার্ভার পরিবেশের জন্য হেডলেস ব্রাউজার একটি চমৎকার টুল, যেখানে কোনো দৃশ্যমান UI শেলের প্রয়োজন হয় না। উদাহরণস্বরূপ, আপনি হয়তো কোনো আসল ওয়েব পেজের ওপর কিছু পরীক্ষা চালাতে, সেটির একটি পিডিএফ তৈরি করতে, অথবা ব্রাউজারটি কীভাবে একটি URL রেন্ডার করে তা পর্যবেক্ষণ করতে চাইতে পারেন।

হেডলেস শুরু (CLI)

হেডলেস মোড চালু করার সবচেয়ে সহজ উপায় হলো কমান্ড লাইন থেকে ক্রোম বাইনারিটি খোলা। যদি আপনার ক্রোম ৫৯+ ইনস্টল করা থাকে, তাহলে --headless ফ্ল্যাগ সহ ক্রোম চালু করুন:

chrome \
--headless \                   # Runs Chrome in headless mode.
--disable-gpu \                # Temporarily needed if running on Windows.
--remote-debugging-port=9222 \
https://www.chromestatus.com   # URL to open. Defaults to about:blank.

দ্রষ্টব্য: এই মুহূর্তে, আপনি যদি উইন্ডোজে চালান, তাহলে আপনাকে --disable-gpu ফ্ল্যাগটিও অন্তর্ভুক্ত করতে হবে। crbug.com/737678 দেখুন।

আপনার ইনস্টলেশন করা ক্রোমের chrome নির্দেশ করা উচিত। এর সঠিক অবস্থান প্ল্যাটফর্ম ভেদে ভিন্ন হবে। যেহেতু আমি ম্যাক ব্যবহার করি, তাই আমার ইনস্টল করা ক্রোমের প্রতিটি সংস্করণের জন্য আমি সুবিধাজনক অ্যালিয়াস তৈরি করেছি।

আপনি যদি ক্রোমের স্টেবল চ্যানেল ব্যবহার করেন এবং বিটা সংস্করণটি না পান, তাহলে chrome-canary ব্যবহার করুন।

alias chrome="/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome"
alias chrome-canary="/Applications/Google\ Chrome\ Canary.app/Contents/MacOS/Google\ Chrome\ Canary"
alias chromium="/Applications/Chromium.app/Contents/MacOS/Chromium"

ক্রোম ক্যানারি ডাউনলোড করুন।

কমান্ড লাইন বৈশিষ্ট্য

কিছু ক্ষেত্রে, আপনার হেডলেস ক্রোম প্রোগ্রাম্যাটিকভাবে স্ক্রিপ্ট করার প্রয়োজন নাও হতে পারে। সাধারণ কাজগুলো সম্পাদনের জন্য কিছু দরকারি কমান্ড লাইন ফ্ল্যাগ রয়েছে।

DOM প্রিন্ট করা

--dump-dom ফ্ল্যাগটি document.body.innerHTML কে stdout-এ প্রিন্ট করে:

    chrome --headless --disable-gpu --dump-dom https://www.chromestatus.com/


### Create a PDF

The `--print-to-pdf` flag creates a PDF of the page:

```shell
chrome --headless --disable-gpu --print-to-pdf https://www.chromestatus.com/

স্ক্রিনশট নেওয়া

কোনো পৃষ্ঠার স্ক্রিনশট নিতে, --screenshot ফ্ল্যাগটি ব্যবহার করুন:

chrome --headless --disable-gpu --screenshot https://www.chromestatus.com/

# Size of a standard letterhead.
chrome --headless --disable-gpu --screenshot --window-size=1280,1696 https://www.chromestatus.com/

# Nexus 5x
chrome --headless --disable-gpu --screenshot --window-size=412,732 https://www.chromestatus.com/

--screenshot সহ চালালে বর্তমান ওয়ার্কিং ডিরেক্টরিতে screenshot.png নামের একটি ফাইল তৈরি হবে। আপনি যদি পুরো পৃষ্ঠার স্ক্রিনশট নিতে চান, তবে বিষয়টি কিছুটা জটিল। ডেভিড শ্নুর-এর একটি চমৎকার ব্লগ পোস্ট আছে যেখানে এই বিষয়ে বিস্তারিত বলা আছে। 'Using headless Chrome as an automated screenshot tool ' পোস্টটি দেখুন।

REPL মোড (রিড-ইভ্যাল-প্রিন্ট লুপ)

--repl ফ্ল্যাগটি হেডলেসকে এমন একটি মোডে চালু করে, যেখানে আপনি সরাসরি কমান্ড লাইন থেকেই ব্রাউজারে JS এক্সপ্রেশন মূল্যায়ন করতে পারেন:

$ chrome --headless --disable-gpu --repl --crash-dumps-dir=./tmp https://www.chromestatus.com/
[0608/112805.245285:INFO:headless_shell.cc(278)] Type a Javascript expression to evaluate or "quit" to exit.
>>> location.href
{"result":{"type":"string","value":"https://www.chromestatus.com/features"}}
>>> quit
$

ব্রাউজার UI ছাড়া ক্রোম ডিবাগিং?

যখন আপনি --remote-debugging-port=9222 সহ Chrome চালান, তখন এটি DevTools প্রোটোকল সক্রিয় করে একটি ইনস্ট্যান্স চালু করে। এই প্রোটোকলটি Chrome-এর সাথে যোগাযোগ করতে এবং হেডলেস ব্রাউজার ইনস্ট্যান্সটি চালাতে ব্যবহৃত হয়। Sublime, VS Code, এবং Node-এর মতো টুলগুলোও কোনো অ্যাপ্লিকেশন দূর থেকে ডিবাগ করার জন্য এটি ব্যবহার করে। #synergy

যেহেতু পৃষ্ঠাটি দেখার জন্য আপনার কাছে ব্রাউজার UI নেই, সবকিছু ঠিকঠাক কাজ করছে কিনা তা পরীক্ষা করতে অন্য একটি ব্রাউজারে http://localhost:9222 এ যান। আপনি পরিদর্শনযোগ্য পৃষ্ঠাগুলির একটি তালিকা দেখতে পাবেন, যেগুলিতে ক্লিক করে আপনি দেখতে পারবেন হেডলেস কী রেন্ডার করছে:

এখান থেকে, আপনি স্বাভাবিকভাবেই পরিচিত DevTools ফিচারগুলো ব্যবহার করে পেজটি পরিদর্শন, ডিবাগ এবং সূক্ষ্মভাবে পরিবর্তন করতে পারবেন। আপনি যদি প্রোগ্রাম্যাটিকভাবে হেডলেস ব্যবহার করেন, তবে এই পেজটি একটি শক্তিশালী ডিবাগিং টুল হিসেবেও কাজ করে, যা ব্রাউজারের সাথে যোগাযোগের জন্য নেটওয়ার্কের মাধ্যমে প্রেরিত সমস্ত ডেভটুলস প্রোটোকল কমান্ডগুলো দেখতে সাহায্য করে।

প্রোগ্রাম্যাটিকভাবে ব্যবহার করে (নোড)

পুতুলনাচ শিল্পী

পাপেটিয়ার হলো ক্রোম টিমের তৈরি একটি নোড লাইব্রেরি। এটি হেডলেস (বা সম্পূর্ণ) ক্রোম নিয়ন্ত্রণের জন্য একটি উচ্চ-স্তরের এপিআই প্রদান করে। এটি ফ্যান্টম এবং নাইটমেয়ারজেএস-এর মতো অন্যান্য স্বয়ংক্রিয় টেস্টিং লাইব্রেরির অনুরূপ, কিন্তু এটি শুধুমাত্র ক্রোমের সর্বশেষ সংস্করণগুলোর সাথেই কাজ করে।

অন্যান্য কাজের পাশাপাশি, Puppeteer ব্যবহার করে সহজেই স্ক্রিনশট নেওয়া, পিডিএফ তৈরি করা, পৃষ্ঠা পরিবর্তন করা এবং সেই পৃষ্ঠাগুলো সম্পর্কে তথ্য সংগ্রহ করা যায়। আপনি যদি দ্রুত ব্রাউজার টেস্টিং স্বয়ংক্রিয় করতে চান, তবে আমি এই লাইব্রেরিটি ব্যবহারের পরামর্শ দেব। এটি DevTools প্রোটোকলের জটিলতাগুলো আড়াল করে এবং Chrome-এর একটি ডিবাগ ইনস্ট্যান্স চালু করার মতো অপ্রয়োজনীয় কাজগুলো সামলে নেয়।

এটি ইনস্টল করুন:

npm i --save puppeteer

উদাহরণ - ইউজার এজেন্ট প্রিন্ট করুন

const puppeteer = require('puppeteer');

(async() => {
  const browser = await puppeteer.launch();
  console.log(await browser.version());
  await browser.close();
})();

উদাহরণস্বরূপ - পৃষ্ঠাটির একটি স্ক্রিনশট নেওয়া

const puppeteer = require('puppeteer');

(async() => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://www.chromestatus.com', {waitUntil: 'networkidle2'});
  await page.pdf({path: 'page.pdf', format: 'A4'});

  await browser.close();
})();

সম্পূর্ণ এপিআই সম্পর্কে আরও জানতে পাপেটিয়ার-এর ডকুমেন্টেশন দেখুন।

সিআরআই লাইব্রেরি

chrome-remote-interface হলো Puppeteer-এর API-এর চেয়ে একটি নিম্ন-স্তরের লাইব্রেরি। আমি এটি সুপারিশ করি যদি আপনি সরাসরি হার্ডওয়্যারের কাছাকাছি থাকতে চান এবং DevTools প্রোটোকল ব্যবহার করতে চান।

ক্রোম চালু করা

chrome-remote-interface আপনার জন্য ক্রোম চালু করে না, তাই আপনাকে সেই কাজটি নিজে থেকেই করতে হবে।

CLI অংশে, আমরা --headless --remote-debugging-port=9222 ব্যবহার করে ম্যানুয়ালি Chrome চালু করেছি । তবে, টেস্টগুলো পুরোপুরি স্বয়ংক্রিয় করতে, আপনি সম্ভবত আপনার অ্যাপ্লিকেশন থেকেই Chrome চালু করতে চাইবেন।

একটি উপায় হলো child_process ব্যবহার করা:

const execFile = require('child_process').execFile;

function launchHeadlessChrome(url, callback) {
  // Assuming MacOSx.
  const CHROME = '/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome';
  execFile(CHROME, ['--headless', '--disable-gpu', '--remote-debugging-port=9222', url], callback);
}

launchHeadlessChrome('https://www.chromestatus.com', (err, stdout, stderr) => {
  ...
});

কিন্তু আপনি যদি এমন একটি বহনযোগ্য সমাধান চান যা একাধিক প্ল্যাটফর্মে কাজ করে, তাহলে ব্যাপারটা জটিল হয়ে যায়। শুধু ক্রোমের ওই হার্ড-কোডেড পাথটার দিকেই দেখুন :(

ক্রোম লঞ্চার ব্যবহার করে

আপনার ওয়েব অ্যাপের মান পরীক্ষা করার জন্য লাইটহাউস একটি চমৎকার টুল। লাইটহাউসের ভেতরেই ক্রোম চালু করার জন্য একটি শক্তিশালী মডিউল তৈরি করা হয়েছিল এবং এখন তা স্বতন্ত্র ব্যবহারের জন্য আলাদা করা হয়েছে। chrome-launcher NPM মডিউলটি ক্রোম কোথায় ইনস্টল করা আছে তা খুঁজে বের করবে, একটি ডিবাগ ইনস্ট্যান্স তৈরি করবে, ব্রাউজারটি চালু করবে এবং আপনার প্রোগ্রামের কাজ শেষ হলে তা বন্ধ করে দেবে। সবচেয়ে ভালো দিক হলো, নোডের কল্যাণে এটি ক্রস-প্ল্যাটফর্মে কাজ করে!

ডিফল্টরূপে, chrome-launcher ক্রোম ক্যানারি (যদি ইনস্টল করা থাকে) চালু করার চেষ্টা করবে , কিন্তু আপনি কোন ক্রোম ব্যবহার করবেন তা ম্যানুয়ালি নির্বাচন করতে পারেন। এটি ব্যবহার করতে, প্রথমে npm থেকে ইনস্টল করুন:

npm i --save chrome-launcher

উদাহরণস্বরূপ - chrome-launcher ব্যবহার করে হেডলেস চালু করা

const chromeLauncher = require('chrome-launcher');

// Optional: set logging level of launcher to see its output.
// Install it using: npm i --save lighthouse-logger
// const log = require('lighthouse-logger');
// log.setLevel('info');

/**
 * Launches a debugging instance of Chrome.
 * @param {boolean=} headless True (default) launches Chrome in headless mode.
 *     False launches a full version of Chrome.
 * @return {Promise<ChromeLauncher>}
 */
function launchChrome(headless=true) {
  return chromeLauncher.launch({
    // port: 9222, // Uncomment to force a specific port of your choice.
    chromeFlags: [
      '--window-size=412,732',
      '--disable-gpu',
      headless ? '--headless' : ''
    ]
  });
}

launchChrome().then(chrome => {
  console.log(`Chrome debuggable on port: ${chrome.port}`);
  ...
  // chrome.kill();
});

এই স্ক্রিপ্টটি চালালে তেমন কিছু হয় না, কিন্তু আপনি টাস্ক ম্যানেজারে Chrome-এর একটি ইনস্ট্যান্স চালু হতে দেখবেন যা about:blank লোড করেছে। মনে রাখবেন, কোনো ব্রাউজার UI থাকবে না। আমরা হেডলেস।

ব্রাউজার নিয়ন্ত্রণ করতে আমাদের ডেভটুলস প্রোটোকল প্রয়োজন!

পৃষ্ঠাটি সম্পর্কে তথ্য পুনরুদ্ধার করা হচ্ছে

সতর্কীকরণ: ডেভটুলস প্রোটোকল অনেক আকর্ষণীয় কাজ করতে পারে, কিন্তু প্রথমদিকে এটি কিছুটা কঠিন মনে হতে পারে। আমি প্রথমে ডেভটুলস প্রোটোকল ভিউয়ারটি কিছুক্ষণ দেখে নেওয়ার পরামর্শ দিচ্ছি। এরপর, এটি কীভাবে র প্রোটোকলকে র‍্যাপ করে তা দেখতে chrome-remote-interface এপিআই-এর ডকুমেন্টেশনে যান।

লাইব্রেরিটি ইনস্টল করতে:

npm i --save chrome-remote-interface

উদাহরণ

উদাহরণ - ইউজার এজেন্ট প্রিন্ট করুন

const CDP = require('chrome-remote-interface');

...

launchChrome().then(async chrome => {
  const version = await CDP.Version({port: chrome.port});
  console.log(version['User-Agent']);
});

এর ফলে এইরকম কিছু একটা হয়: HeadlessChrome/60.0.3082.0

উদাহরণ - সাইটটিতে একটি ওয়েব অ্যাপ ম্যানিফেস্ট আছে কিনা তা পরীক্ষা করুন।

const CDP = require('chrome-remote-interface');

...

(async function() {

const chrome = await launchChrome();
const protocol = await CDP({port: chrome.port});

// Extract the DevTools protocol domains we need and enable them.
// See API docs: https://chromedevtools.github.io/devtools-protocol/
const {Page} = protocol;
await Page.enable();

Page.navigate({url: 'https://www.chromestatus.com/'});

// Wait for window.onload before doing stuff.
Page.loadEventFired(async () => {
  const manifest = await Page.getAppManifest();

  if (manifest.url) {
    console.log('Manifest: ' + manifest.url);
    console.log(manifest.data);
  } else {
    console.log('Site has no app manifest');
  }

  protocol.close();
  chrome.kill(); // Kill Chrome.
});

})();

উদাহরণ - DOM API ব্যবহার করে পেজের <title> বের করুন।

const CDP = require('chrome-remote-interface');

...

(async function() {

const chrome = await launchChrome();
const protocol = await CDP({port: chrome.port});

// Extract the DevTools protocol domains we need and enable them.
// See API docs: https://chromedevtools.github.io/devtools-protocol/
const {Page, Runtime} = protocol;
await Promise.all([Page.enable(), Runtime.enable()]);

Page.navigate({url: 'https://www.chromestatus.com/'});

// Wait for window.onload before doing stuff.
Page.loadEventFired(async () => {
  const js = "document.querySelector('title').textContent";
  // Evaluate the JS expression in the page.
  const result = await Runtime.evaluate({expression: js});

  console.log('Title of page: ' + result.result.value);

  protocol.close();
  chrome.kill(); // Kill Chrome.
});

})();

সেলেনিয়াম, ওয়েবড্রাইভার এবং ক্রোমড্রাইভার ব্যবহার করে

বর্তমানে, সেলেনিয়াম ক্রোমের একটি সম্পূর্ণ ইনস্ট্যান্স খোলে। অন্য কথায়, এটি একটি স্বয়ংক্রিয় সমাধান, কিন্তু পুরোপুরি হেডলেস নয়। তবে, সামান্য কিছু কাজ করলে সেলেনিয়ামকে হেডলেস ক্রোম চালানোর জন্য কনফিগার করা যায়। আপনি যদি নিজে সবকিছু সেট আপ করার সম্পূর্ণ নির্দেশাবলী চান, তবে আমি 'Running Selenium with Headless Chrome' দেখার পরামর্শ দেব, কিন্তু আপনাকে শুরু করার জন্য আমি নীচে কিছু উদাহরণ দিয়ে দিয়েছি।

ChromeDriver ব্যবহার করে

ChromeDriver 2.32, Chrome 61 ব্যবহার করে এবং হেডলেস Chrome-এর সাথে ভালোভাবে কাজ করে।

ইনস্টল করুন:

npm i --save-dev selenium-webdriver chromedriver

উদাহরণ:

const fs = require('fs');
const webdriver = require('selenium-webdriver');
const chromedriver = require('chromedriver');

const chromeCapabilities = webdriver.Capabilities.chrome();
chromeCapabilities.set('chromeOptions', {args: ['--headless']});

const driver = new webdriver.Builder()
  .forBrowser('chrome')
  .withCapabilities(chromeCapabilities)
  .build();

// Navigate to google.com, enter a search.
driver.get('https://www.google.com/');
driver.findElement({name: 'q'}).sendKeys('webdriver');
driver.findElement({name: 'btnG'}).click();
driver.wait(webdriver.until.titleIs('webdriver - Google Search'), 1000);

// Take screenshot of results page. Save to disk.
driver.takeScreenshot().then(base64png => {
  fs.writeFileSync('screenshot.png', new Buffer(base64png, 'base64'));
});

driver.quit();

WebDriverIO ব্যবহার করে

WebDriverIO হলো Selenium WebDriver-এর উপরে অবস্থিত একটি উচ্চতর API।

ইনস্টল করুন:

npm i --save-dev webdriverio chromedriver

উদাহরণ: chromestatus.com-এ CSS বৈশিষ্ট্য ফিল্টার করা।

const webdriverio = require('webdriverio');
const chromedriver = require('chromedriver');

const PORT = 9515;

chromedriver.start([
  '--url-base=wd/hub',
  `--port=${PORT}`,
  '--verbose'
]);

(async () => {

const opts = {
  port: PORT,
  desiredCapabilities: {
    browserName: 'chrome',
    chromeOptions: {args: ['--headless']}
  }
};

const browser = webdriverio.remote(opts).init();

await browser.url('https://www.chromestatus.com/features');

const title = await browser.getTitle();
console.log(`Title: ${title}`);

await browser.waitForText('.num-features', 3000);
let numFeatures = await browser.getText('.num-features');
console.log(`Chrome has ${numFeatures} total features`);

await browser.setValue('input[type="search"]', 'CSS');
console.log('Filtering features...');
await browser.pause(1000);

numFeatures = await browser.getText('.num-features');
console.log(`Chrome has ${numFeatures} CSS features`);

const buffer = await browser.saveScreenshot('screenshot.png');
console.log('Saved screenshot...');

chromedriver.stop();
browser.end();

})();

পুরানো হেডলেস ক্রোম `chrome-headless-shell` হিসেবে ডাউনলোড করুন।

ক্রোম সংস্করণ ১১২ থেকে এর নতুন হেডলেস মোড ( --headless=new ) উপলব্ধ হয়েছে। এই মোডটি ডেভেলপারদের কোনো দৃশ্যমান UI ছাড়াই একটি স্বয়ংক্রিয় পরিবেশে আলাদা কোনো বাইনারির পরিবর্তে সরাসরি ক্রোম চালানোর সুযোগ দেয়—যা টেস্টিং এবং অটোমেশনের ক্ষেত্রে বেশ উপযোগী।

পুরানো হেডলেস শেল এবং নতুন হেডলেস মোডের স্বতন্ত্র ব্যবহার ক্ষেত্র রয়েছে:

পুরানো হেডলেস শেলটি হলো ক্রোমিয়ামের //content মডিউলের একটি হালকা র‍্যাপার, এবং একারণে এর নির্ভরতা অনেক কম। বিশেষত, এর জন্য X11/Wayland, D-Bus-এর প্রয়োজন হয় না, এবং কিছু ক্ষেত্রে এটি পূর্ণাঙ্গ ক্রোম ব্রাউজারের চেয়েও বেশি পারফর্ম করে। এই কারণে এটি স্বয়ংক্রিয় স্ক্রিনশট নেওয়া বা ওয়েব স্ক্র্যাপিংয়ের মতো কাজের জন্য উপযুক্ত।
অন্যদিকে নতুন হেডলেস মোডটি হলো আসল ক্রোম ব্রাউজার, এবং একারণে এটি আরও বেশি খাঁটি, নির্ভরযোগ্য ও অধিক বৈশিষ্ট্যসম্পন্ন। এই কারণে এটি উচ্চ-নির্ভুল এন্ড-টু-এন্ড ওয়েব অ্যাপ টেস্টিং অথবা ব্রাউজার এক্সটেনশন টেস্টিংয়ের জন্য অধিক উপযুক্ত।

অন্য কথায়, পারফরম্যান্স এবং বাস্তবতার মধ্যে একটি ভারসাম্য রক্ষা করতে হয়। কোন হেডলেস মোডটি আপনার জন্য সবচেয়ে উপযুক্ত? এটি আপনার ব্যবহারের ধরনের উপর নির্ভর করে।

পূর্ববর্তী তালিকায় প্রদত্ত তথ্য ব্যাখ্যা করার জন্য একটি রেখাচিত্র।

যেসব ডেভেলপার এবং টেস্টারের অটোমেশন কাজের জন্য ক্রোমের সম্পূর্ণ কার্যকারিতার প্রয়োজন নেই, তারা পুরোনো হেডলেস ব্যবহার করতে পারেন। অন্যথায়, নতুন হেডলেস সম্ভবত সেরা বিকল্প।

ডেভেলপার এবং টেস্টারদের জন্য এই দুটি বিকল্পের মধ্যে বেছে নেওয়ার সুযোগ অব্যাহত রাখতে, আমরা আনন্দের সাথে জানাচ্ছি যে পুরোনো হেডলেস ইমপ্লিমেন্টেশনটি এখন একটি স্বতন্ত্র chrome-headless-shell বাইনারি হিসেবে উপলব্ধ। এই নতুন chrome-headless-shell বাইনারিগুলো ব্যবহারকারীদের জন্য প্রকাশিত প্রতিটি ক্রোম রিলিজের জন্য তৈরি করা হয় এবং ক্রোম ১২০ থেকে শুরু করে Chrome for Testing ইনফ্রাস্ট্রাকচারের মাধ্যমে ডাউনলোডের জন্য উপলব্ধ।

আমি কীভাবে `chrome-headless-shell` বাইনারিগুলো পেতে পারি?

অন্যান্য Chrome for Testing বাইনারিগুলোর মতোই, আপনার প্ল্যাটফর্মের জন্য chrome-headless-shell ডাউনলোড করার সবচেয়ে সহজ উপায় হলো আমাদের @puppeteer/browsers কমান্ড-লাইন ইউটিলিটি ব্যবহার করা, যা npm মাধ্যমে পাওয়া যায়। এখানে কিছু উদাহরণ দেওয়া হলো:

# Download the latest available `chrome-headless-shell` binary corresponding to the Stable channel.
npx @puppeteer/browsers install chrome-headless-shell@stable

# Download a specific `chrome-headless-shell` version.
npx @puppeteer/browsers install chrome-headless-shell@120.0.6098.0

আপনি যদি chrome-headless-shell বাইনারি ডাউনলোড করার জন্য নিজের স্বয়ংক্রিয় স্ক্রিপ্ট তৈরি করতে চান, তবে তার ব্যবস্থাও রয়েছে। Chrome for Testing প্রতিটি Chrome রিলিজ চ্যানেল (Stable, Beta, Dev, এবং Canary) অনুযায়ী সর্বশেষ উপলব্ধ সংস্করণসহ JSON API এন্ডপয়েন্ট অফার করে। সর্বশেষ অবস্থা সম্পর্কে দ্রুত ধারণা পেতে, Chrome for Testing অ্যাভেইলেবিলিটি ড্যাশবোর্ডটি দেখুন।

প্রতিক্রিয়া

chrome-headless-shell সম্পর্কে আপনার মতামতের অপেক্ষায় রইলাম। কোনো সমস্যা হলে, নির্দ্বিধায় আমাদের জানান ।

আরও তথ্যসূত্র

আপনাকে শুরু করতে সাহায্য করার জন্য এখানে কিছু দরকারি রিসোর্স দেওয়া হলো:

ডাক্তাররা

ডেভটুলস প্রোটোকল ভিউয়ার - এপিআই রেফারেন্স ডক্স

সরঞ্জাম

chrome-remote-interface - একটি নোড মডিউল যা DevTools প্রোটোকলকে আবৃত করে।
লাইটহাউস - ওয়েব অ্যাপের মান পরীক্ষার একটি স্বয়ংক্রিয় টুল; এটি প্রোটোকলটি ব্যাপকভাবে ব্যবহার করে।
ক্রোম-লঞ্চার - ক্রোম চালু করার জন্য একটি নোড মডিউল, যা অটোমেশনের জন্য প্রস্তুত।

ডেমো

" দ্য হেডলেস ওয়েব " - api.ai-এর সাথে হেডলেস ব্যবহারের উপর পল কিনলানের একটি চমৎকার ব্লগ পোস্ট।

প্রায়শই জিজ্ঞাসিত প্রশ্নাবলী

আমার কি --disable-gpu ফ্ল্যাগটির প্রয়োজন আছে?

শুধুমাত্র উইন্ডোজের জন্য। অন্যান্য প্ল্যাটফর্মে এটির আর প্রয়োজন নেই। --disable-gpu ফ্ল্যাগটি কয়েকটি বাগের জন্য একটি অস্থায়ী সমাধান। ক্রোমের ভবিষ্যৎ সংস্করণগুলিতে আপনার এই ফ্ল্যাগটির প্রয়োজন হবে না। আরও তথ্যের জন্য crbug.com/737678 দেখুন।

তাহলে আমার কি এখনও Xvfb দরকার?

না। হেডলেস ক্রোম কোনো উইন্ডো ব্যবহার করে না, তাই Xvfb-এর মতো কোনো ডিসপ্লে সার্ভারের আর প্রয়োজন হয় না। আপনি এটি ছাড়াই নিশ্চিন্তে আপনার স্বয়ংক্রিয় টেস্টগুলো চালাতে পারেন।

Xvfb কী? Xvfb হলো ইউনিক্স-সদৃশ সিস্টেমের জন্য একটি ইন-মেমরি ডিসপ্লে সার্ভার, যা আপনাকে কোনো সংযুক্ত ফিজিক্যাল ডিসপ্লে ছাড়াই গ্রাফিক্যাল অ্যাপ্লিকেশন (যেমন ক্রোম) চালাতে দেয়। অনেকেই "হেডলেস" টেস্টিং করার জন্য ক্রোমের পুরোনো সংস্করণগুলো চালাতে Xvfb ব্যবহার করেন।

আমি কীভাবে একটি ডকার কন্টেইনার তৈরি করব যা হেডলেস ক্রোম চালাবে?

lighthouse-ci দেখুন। এতে একটি উদাহরণ Dockerfile আছে যা node:8-slim বেস ইমেজ হিসেবে ব্যবহার করে App Engine Flex-এ Lighthouse ইনস্টল ও রান করে ।

দ্রষ্টব্য: আপনি যদি কন্টেইনারে সঠিকভাবে একজন ব্যবহারকারী সেটআপ করে থাকেন , তাহলে --no-sandbox প্রয়োজন নেই।

আমি কি এটা Selenium / WebDriver / ChromeDriver এর সাথে ব্যবহার করতে পারি ?

হ্যাঁ। Selenium, WebDriver, এবং ChromeDriver-এর ব্যবহার দেখুন।

এর সাথে PhantomJS-এর সম্পর্ক কী?

হেডলেস ক্রোম, ফ্যান্টমজেএস (PhantomJS) -এর মতো টুলগুলোর অনুরূপ। উভয়ই একটি হেডলেস পরিবেশে স্বয়ংক্রিয় পরীক্ষার জন্য ব্যবহার করা যেতে পারে। উভয়ের মধ্যে প্রধান পার্থক্য হলো, ফ্যান্টম তার রেন্ডারিং ইঞ্জিন হিসেবে ওয়েবকিট (WebKit)-এর একটি পুরোনো সংস্করণ ব্যবহার করে, অন্যদিকে হেডলেস ক্রোম ব্লিংক (Blink)-এর সর্বশেষ সংস্করণ ব্যবহার করে।

বর্তমানে, ফ্যান্টম ডেভটুলস প্রোটোকলের চেয়েও একটি উচ্চতর স্তরের এপিআই প্রদান করে।

আমি কোথায় বাগ রিপোর্ট করব?

হেডলেস ক্রোমের ত্রুটিগুলো crbug.com- এ রিপোর্ট করুন।

DevTools প্রোটোকলের ত্রুটিগুলির জন্য, github.com/ChromeDevTools/devtools-protocol -এ অভিযোগ জানান।