<?xml version='1.0' encoding='UTF-8'?>
<?xml-stylesheet href="/rss/stylesheet/" type="text/xsl"?>
<rss xmlns:content='http://purl.org/rss/1.0/modules/content/' xmlns:taxo='http://purl.org/rss/1.0/modules/taxonomy/' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns#' xmlns:itunes='http://www.itunes.com/dtds/podcast-1.0.dtd' xmlns:googleplay="http://www.google.com/schemas/play-podcasts/1.0" xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:atom='http://www.w3.org/2005/Atom' xmlns:podbridge='http://www.podbridge.com/podbridge-ad.dtd' version='2.0'>
<channel>
  <title>Jaryl Chng&apos;s Knowledge Base</title>
  <language>en-us</language>
  <generator>microfeed.org</generator>
  <itunes:type>episodic</itunes:type>
  <itunes:explicit>false</itunes:explicit>
  <atom:link rel="self" href="https://kb-jarylchng-com.pages.dev/rss/" type="application/rss+xml"/>
  <link>https://kb.jarylchng.com</link>
  <description>
    <![CDATA[<p>Welcome to the index page of my knowledge base, if you haven't done so, do visit my website at <a href="https://jarylchng.com" rel="noopener noreferrer" target="_blank">https://jarylchng.com</a>.</p><p>I will mainly use this site to document stuff, most of which will likely be in the public domain.</p>]]>
  </description>
  <itunes:author>Jaryl Chng</itunes:author>
  <itunes:image href="https://kb-static.jarylchng.com/kb-jarylchng-com/production/images/channel-c68f1f55f856ab833b4365991609dbec.png"/>
  <image>
    <title>Jaryl Chng&apos;s Knowledge Base</title>
    <url>https://kb-static.jarylchng.com/kb-jarylchng-com/production/images/channel-c68f1f55f856ab833b4365991609dbec.png</url>
    <link>https://kb.jarylchng.com</link>
  </image>
  <copyright>©2024</copyright>
  <itunes:category text="Technology"/>
  <item>
    <title>Javascript - Using chromedp/headless-shell Docker image for Puppeteer</title>
    <guid>ybhdO8oR3sV</guid>
    <pubDate>Sat, 06 Apr 2024 16:23:08 GMT</pubDate>
    <itunes:explicit>false</itunes:explicit>
    <description>
      <![CDATA[<p>I had a personal project that made use of an awesome Puppeteer plugin called <a href="https://www.npmjs.com/package/puppeteer-extra-plugin-portal" rel="noopener noreferrer" target="_blank">puppeteer-extra-plugin-portal</a> by <a href="https://github.com/claabs/puppeteer-extra-plugin-portal" rel="noopener noreferrer" target="_blank">claabs</a>. I wanted to create a Docker container that was small and found <a href="https://hub.docker.com/r/chromedp/headless-shell" rel="noopener noreferrer" target="_blank">chromedp/headless-shell</a>.</p><h2>Sources</h2><h3>main.js</h3><pre class="ql-syntax" spellcheck="false">import puppeteer from 'puppeteer';
puppeteer.launch(
{
  headless: true,
  args: [
    "--disable-gpu",
    "--disable-dev-shm-usage",
    "--disable-setuid-sandbox",
    "--no-sandbox",
  ],
}).then(async browser =&gt; {
    const page = await browser.newPage();
    // further logic...
  }
)
</pre><blockquote>Not much difference from a regular Puppeteer setup</blockquote><h3>.dockerignore</h3><pre class="ql-syntax" spellcheck="false">.git
*.log
node_modules
Dockerfile
</pre><blockquote>We don't want node_modules folder especially as it might contain locally downloaded Chromium for development</blockquote><h3>Dockerfile</h3><pre class="ql-syntax" spellcheck="false">FROM chromedp/headless-shell

ENV PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true \
    PUPPETEER_EXECUTABLE_PATH=/headless-shell/headless-shell

COPY . /app
WORKDIR /app

RUN apt-get update &amp;&amp; \
    apt-get install -y tini curl &amp;&amp; \
    curl -fsSL https://deb.nodesource.com/setup_17.x | bash - &amp;&amp; \
    apt-get install -y nodejs &amp;&amp; \
    rm -rf /var/lib/apt/lists/* &amp;&amp; \
    npm install

ENTRYPOINT ["tini", "--"]
CMD ["/usr/bin/node main.js"]
</pre><blockquote>PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true is the most important to keep the image small</blockquote><blockquote>chromedp/headless-shell runs Debian and not Alpine for smaller image sadly, hence using apt, I might look into creating an automated build for Alpine images in the future</blockquote>]]>
    </description>
    <link>https://kb.jarylchng.com/i/javascript-using-chromedpheadless-shell-docker-ybhdO8oR3sV/</link>
    <itunes:episodeType>full</itunes:episodeType>
  </item>
</channel>
</rss>