Skip to main content

Getting started

Welcome to a quick-start! Take a look at the instructions on dealing with most common methods as well as at the top three supported integrations. Note that the other supported REST and API's methods are given at the sidebar.

Puppeteer​

BrowserCloud enables you to perform an easy shift no matter what your intention is: either to start or to continue with the given codebase. The below-mentioned has to be done at a high-level:

Puppeteer installation​

Being one of the best and high-grade libraries and created by Chrome designers, puppeteer is maintained a lot. So, we strongly encourage you to use it.

Puppeteer installation​

$ npm i --save puppeteer
$ yarn add puppeteer

Chrome uses BrowserCloud, so that during the production you won't need to install puppeteer's Chromium bundled version. During the installation, just add an environment variable to terminate the puppeteer download.

Installation for production​

$ PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true npm install --production
$ PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true yarn install --production

Your application​

const express = require('express');
const puppeteer = require('puppeteer');
const IS_PRODUCTION = process.env.NODE_ENV === 'production';

const app = express();

const getBrowser = () => IS_PRODUCTION ?

  // Connect to the BrowresCloud endpoint
  puppeteer.connect({ browserWSEndpoint: 'wss://chrome.browsercloud.io?token=MY-API-TOKEN' }) :

  // Run the browser locally for further development
  puppeteer.launch();

app.get('/screenshot', async (req, res) => {
  let browser = null;

  try {
    browser = await getBrowser();
    const page = await browser.newPage();

    await page.goto('http://www.yoursite.com/');
    const screenshot = await page.screenshot();

    res.end(screenshot, 'binary');
  } catch (error) {
    if (!res.headersSent) {
      res.status(400).send(error.message);
    }
  } finally {
    if (browser) {
      browser.close();
    }
  }
});

Using your service make up a site screenshot:

curl -X GET -o screenshot.png http://localhost:8080/screenshot

WebDriver or Selenium​

WebDriver Setup​

Ruby bindings will be used as an example. However, almost every language is provided with the library for WebDriver. For any further directions refer to a runtime's library.

# Specify--no-sandbox and--headless
options = Selenium::WebDriver::Chrome::Options.new
options.add_argument('--headless')
options.add_argument('--no-sandbox')

# The webdriver can be used for taking pictures, visiting sites etc. Close the browser when complete your task.
driver = Selenium::WebDriver.for :chrome, options: options

Before you start eliminating any unwanted behavior, make sure the script operates right after the setup procedure.

Update the builder to use BrowserCloud​

# Specify --no-sandbox and --headless
caps = Selenium::WebDriver::Remote::Capabilities.chrome("goog:chromeOptions" => {
  "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"
  ]
})
driver = Selenium::WebDriver.for :remote, url: "https://MY_API_TOKEN@chrome.browsercloud.io/webdriver" desired_capabilities: caps

# The webdriver can be used for taking pictures, visiting sites etc. Close the browser when complete your task.
driver = Selenium::WebDriver.for :chrome, options: options

Since you check whether it duly operates, use BrowserCloud in a continuous integration environment only. There you go!