- base url:
- production:
https://pptr.io/ - preview (staging):
https://dev.pptr.io/
- production:
- default path:
api/ - endpoint: any one of the individual
.jsfiles in the api folder- ignore the
index.jsfile inside theapifolder
- ignore the
- task: takes a screenshot of the input url
- class: page.screenshot
- method:
GET - api:
https://pptr.io/api/screenshot?url=https://dev.to - source: screenshot.js
| optional params | type | description | default |
|---|---|---|---|
width |
number | width of the screenshot. | 1920 |
height |
number | height of the screenshot. | 1080 |
deviceScaleFactor |
number | device scale factor (can be thought of as DPR). | 1 |
fullPage |
boolean | when true, takes a screenshot of the full scrollable page. |
false |
type |
string | can be either jpeg, png or webp. |
png |
sample output of the screenshot endpoint
- task: fetch metrics of the page
- class: page.metrics
- method:
GET - api:
https://pptr.io/api/metrics?url=https://script.gs - source: metrics.js
sample output of the metrics endpoint
{
"Timestamp": 2469.885878,
"Documents": 5,
"Frames": 2,
"JSEventListeners": 150,
"Nodes": 391,
"LayoutCount": 4,
"RecalcStyleCount": 9,
"LayoutDuration": 0.038393,
"RecalcStyleDuration": 0.018054,
"ScriptDuration": 0.316212,
"TaskDuration": 0.745999,
"JSHeapUsedSize": 8158228,
"JSHeapTotalSize": 10993664
}- task: get a timeline trace
- class: page.tracing
- method:
GET - api:
https://pptr.io/api/trace?url=https://script.gs - source: trace.js
View the trace in timeline-viewer — chromedevtools.github.io/timeline-viewer (drag and drop the trace.json file on the browser)
- task: render page as a pdf
- class: page.pdf
- method:
GET - api:
https://pptr.io/api/pdf?url=https://netflix.com - source: pdf.js
| optional params | type | description | default |
|---|---|---|---|
scale |
number | scale of webpage rendering. must be between 0.1 and 2. | 1 |
landscape |
boolean | when true, the orientation of the paper is in landscape mode. |
false |
format |
string | overrides width/height and can be any of Letter, Legal, Tabloid, Ledger, A0, A1, A2, A3, A4, A5 or A6. |
Letter |
width |
number | string | width of the paper, units allowed are px, in, cm and mm. |
null |
height |
number | string | height of the paper, units allowed are px, in, cm and mm. |
null |
- task: fetch meta tag data from a website
- method:
GET - api:
https://pptr.io/api/meta?url=https://vercel.com - source: meta.js
sample output of the meta endpoint
{
"charset": "utf-8",
"viewport": "width=device-width, initial-scale=1.0",
"Content-Language": "en",
"twitter:card": "summary_large_image",
"twitter:site": "@vercel",
"twitter:image": "https://assets.vercel.com/image/upload/q_auto/front/vercel/dps.png",
"og:title": "Develop. Preview. Ship. For the best frontend teams – Vercel",
"og:url": "https://vercel.com/",
"description": "Deploy web projects with the best frontend developer experience and highest end-user performance.",
"og:description": "Deploy web projects with the best frontend developer experience and highest end-user performance.",
"og:image": "https://assets.vercel.com/image/upload/q_auto/front/vercel/dps.png",
"apple-mobile-web-app-title": "Vercel",
"theme-color": "#000",
"msapplication-TileColor": "#000000",
"next-head-count": "35"
}- task: retrieve the "about" profiles links (website, twitter, facebook, instagram, youtube etc.) of a search query from duckduckgo
- method:
GET - api:
https://pptr.io/api/duckduckgo_profiles?search=taylor+swift - source: duckduckgo_profiles.js
sample output of the duckduckgo_profiles endpoint
{
"Website": "https://taylorswift.com",
"Wikipedia": "https://en.wikipedia.org/wiki/Taylor_Swift",
"Twitter": "https://twitter.com/taylorswift13",
"Instagram": "https://instagram.com/taylorswift",
"Facebook": "https://facebook.com/TaylorSwift",
"Spotify": "https://open.spotify.com/artist/06HL4z0CvFAxyc27GXpf02",
"IMDb": "https://www.imdb.com/name/nm2357847",
"YouTube": "https://youtube.com/channel/UCqECaJ8Gagnn7YCbPEzWH6g",
"SoundCloud": "https://soundcloud.com/taylorswiftofficial"
}- task: fetch browser user agent / chromium version
- class: browser.userAgent
- method:
GET - api:
https://pptr.io/api/version - source: version.js
sample output of the version endpoint
{
"version": "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) HeadlessChrome/92.0.4512.0 Safari/537.36"
}- create a new issue describing what you have in mind.
- challenge / problem statement
- proposed approach on solution
- repo owner will engage you and help validate the idea
- once everything is agreed upon, feel free to frok the repo and start building your solution
- finally, create a new pull request in the
devbranch with the accepted, proposed changes
- if it weren't for jarrod overson's videos, i might've probably not gotten the courage to start working with puppeteer.
- props to the original idea via pptraas.com — although, i like my current domain name just the same ;)
- huge thanks to Salma | @whitep4nth3r for sharing insights on the puppeteer <> vercel blog post.
MIT License
Copyright (c) 2021 Sourabh Choraria
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.