Puppeteer \u3092\u63a8\u5968\u3057\u3066\u3044\u307e\u3059\u3002Node.js \u3067\u5229\u7528\u3059\u308b\u30e9\u30a4\u30d6\u30e9\u30ea\u30fc\u3067\u3059\u3002\u53c2\u8003\u306b\u3057\u305f\u30b5\u30a4\u30c8\u3092\u4e0b\u8a18\u306b\u3042\u3052\u307e\u3059\u3002<\/p>\n
- \n
- Puppeteer \u306e\u30b5\u30a4\u30c8<\/a><\/li>\n
- html\u3067\u4f5c\u6210\u3057\u305f\u30c7\u30fc\u30bf\u3092jpeg\u306b\u5909\u63db\u3059\u308b\u65b9\u6cd5\u306f\u3042\u308a\u307e\u3059\u304b<\/a><\/li>\n
- \u30102023\u5e744\u6708\u7248\u3011Ubuntu \u306b node.js \u3068 npm \u3092\u5165\u308c\u305f\u3044\uff08\u30d0\u30fc\u30b8\u30e7\u30f3\u7ba1\u7406\u3082\uff09<\/a><\/li>\n<\/ul>\n
ubuntu22 \u3067\u3084\u3063\u3066\u307f\u307e\u3057\u305f\u3002\u3057\u304b\u3057\u30c7\u30d5\u30a9\u30eb\u30c8\u306e Node.js \u306f\u30d0\u30fc\u30b8\u30e7\u30f3\u304c\u53e4\u304f\u5bfe\u5fdc\u3057\u3066\u3044\u307e\u305b\u3093\u3002\u305d\u308c\u3067\u5148\u306e\u30ea\u30f3\u30af\u5148\u306b\u3042\u308b\u3084\u308a\u65b9\u3067\u3001\u6700\u65b0\u306e\u30d0\u30fc\u30b8\u30e7\u30f3\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u307e\u3057\u305f\u3002\u5165\u529b\u306e\u307f\u4e0b\u8a18\u306b\u8a18\u3057\u307e\u3059\u3002<\/p>\n
sudo apt install -y nodejs npm\r\nsudo npm install n -g\r\nsudo n stable\r\nsudo apt purge -y nodejs npm\r\nsudo apt autoremove -y<\/code><\/pre>\n\u3044\u3063\u305f\u3093\u518d\u8d77\u52d5\u3092\u304b\u3051\u305f\u307b\u3046\u304c\u826f\u3044\u304b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n
node -v\r\nv22.11.0\r\n\r\nnpm -v\r\n10.9.0<\/code><\/pre>\nNode.js \u306e\u65b0\u3057\u3044\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3092\u7528\u610f\u3057\u307e\u3059\u3002\u9069\u5f53\u306a\u30d5\u30a9\u30eb\u30c0\u30fc\u3092\u4f5c\u6210\u3057\u307e\u3059\u3002<\/p>\n
mkdir puppeteer\r\ncd .\/puppeteer\/<\/code><\/pre>\n\u65b0\u3057\u3044\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3092\u7528\u610f\u3057\u307e\u3059\u3002\u5165\u529b\u306f\u307b\u307c\u7a7a\u3067\u30a8\u30f3\u30bf\u30fc\u3092\u6253\u3064\u3060\u3051\u3067\u3059\u304c\u3001\u6700\u5f8c\u3060\u3051 yes \u3092\u6253\u3061\u307e\u3057\u305f\u3002<\/p>\n
~\/puppeteer$ npm init\r\nThis utility will walk you through creating a package.json file.\r\nIt only covers the most common items, and tries to guess sensible defaults.\r\n\r\nSee `npm help init` for definitive documentation on these fields\r\nand exactly what they do.\r\n\r\nUse `npm install` afterwards to install a package and\r\nsave it as a dependency in the package.json file.\r\n\r\nPress ^C at any time to quit.\r\npackage name: (puppeteer) \r\nversion: (1.0.0) \r\ndescription: \r\nentry point: (index.js) \r\ntest command: \r\ngit repository: \r\nkeywords: \r\nauthor: \r\nlicense: (ISC) \r\nAbout to write to \/home\/friend\/puppeteer\/package.json:\r\n\r\n{\r\n \"name\": \"puppeteer\",\r\n \"version\": \"1.0.0\",\r\n \"main\": \"index.js\",\r\n \"scripts\": {\r\n \"test\": \"echo \\\"Error: no test specified\\\" && exit 1\"\r\n },\r\n \"author\": \"\",\r\n \"license\": \"ISC\",\r\n \"description\": \"\"\r\n}\r\n\r\n\r\nIs this OK? (yes) yes<\/code><\/pre>\n Puppeteer \u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u307e\u3059\u3002<\/p>\n
~\/puppeteer$ npm i puppeteer\r\n\r\nadded 108 packages, and audited 109 packages in 19s\r\n\r\n10 packages are looking for funding\r\n run `npm fund` for details\r\n\r\nfound 0 vulnerabilities\r\n<\/code><\/pre>\n\u4e0b\u8a18\u306e\u3088\u3046\u306a\u30b3\u30fc\u30c9\u3092\u3001html-to-jpeg.js \u30d5\u30a1\u30a4\u30eb\u3068\u3057\u3066\u7528\u610f\u3057\u307e\u3059\u3002<\/p>\n
const puppeteer = require('puppeteer');\r\n\r\n(async () => {\r\n const browser = await puppeteer.launch();\r\n const page = await browser.newPage();\r\n await page.goto('https:\/\/techblog.recruit.co.jp\/article-1119\/'); \/\/ ここに変換したいHTMLのURLを入力\r\n \/\/ Set screen size.\r\n await page.setViewport({width: 1920, height: 1200});\r\n\r\n await page.screenshot({path: 'output.jpeg', type: 'jpeg'});\r\n await browser.close();\r\n})();<\/code><\/pre>\n\u3053\u308c\u3092\u5b9f\u884c\u3057\u307e\u3059\u3002<\/p>\n
node html-to-jpeg.js\r\n<\/code><\/pre>\n\u753b\u50cf\u304c\u4f5c\u6210\u3055\u308c\u307e\u3057\u305f\u3002<\/p>\n
(20250117) \u8ffd\u8a18<\/strong><\/p>\n
\u4e0a\u8a18\u306e\u30b3\u30fc\u30c9\u3067\u306f\u3001\u30da\u30fc\u30b8\u306e\u51e6\u7406\u306b\u6642\u9593\u304c\u304b\u304b\u308b\u5834\u5408\u306b\u3001\u51e6\u7406\u304c\u7d42\u4e86\u3059\u308b\u524d\u306e\u30da\u30fc\u30b8\u3092\u30ad\u30e3\u30d7\u30c1\u30e3\u30fc\u3057\u3066\u3057\u307e\u3044\u307e\u3059\u3002\u30da\u30fc\u30b8\u306b javascript \u3067\u51e6\u7406\u3092\u304b\u3051\u308b\u3088\u3046\u306a\u3082\u306e\u3060\u3068\u4e0a\u624b\u304f\u3044\u304b\u306a\u3044\u3002\u305d\u3053\u3067\u3001\u5b89\u6613\u306a\u65b9\u6cd5\u3067\u306f\u3042\u308a\u307e\u3059\u304c\u3001\u30ad\u30e3\u30d7\u30c1\u30e3\u30fc\u307e\u3067\u306b\u5f85\u3061\u6642\u9593\u3092\u8a2d\u3051\u3066\u307f\u307e\u3057\u305f\uff08\u53c2\u8003\u30b5\u30a4\u30c8<\/a>\uff09\u3002<\/p>\n
const puppeteer = require('puppeteer');\r\n\r\nconst targetURL = \"http:\/\/192.168.100.19\/sample\/html\/index.html\";\r\n\r\nfunction setTimeoutAsync(milliseconds) {\r\n \/\/ Promise\u30aa\u30d6\u30b8\u30a7\u30af\u30c8\u3092\u8fd4\u3059\r\n return new Promise(resolve => {\r\n \/\/ \u4e00\u5b9a\u6642\u9593\u7d4c\u904e\u5f8c\u306bresolve()\u3092\u5b9f\u884c\u3059\u308b\r\n setTimeout(resolve, milliseconds);\r\n });\r\n}\r\n\r\n(async () => {\r\n const browser = await puppeteer.launch();\r\n const page = await browser.newPage(); \r\n await page.goto(targetURL); \r\n\r\n await setTimeoutAsync(3000); \r\n\r\n \/\/ Set screen size.\r\n await page.setViewport({width: 640, height: 480});\r\n await page.screenshot({path: 'output.jpeg', type: 'jpeg'});\r\n await browser.close();\r\n})();<\/code><\/pre>\n\u6642\u9593\u3092\u5f85\u3064\u95a2\u6570 setTimeoutAsync \u3092\u5b9a\u7fa9\u3057\u3066\u3044\u307e\u3059\u3002\u3053\u308c\u3092\u547c\u3073\u51fa\u3057\u3066\u30013\u79d2\u5f85\u3063\u3066\u3044\u307e\u3059\u3002\u30ad\u30e3\u30d7\u30c1\u30e3\u30fc\u3057\u305f\u753b\u50cf\u306f\u4e0b\u8a18\u3067\u3059\u3002<\/p>\n
- html\u3067\u4f5c\u6210\u3057\u305f\u30c7\u30fc\u30bf\u3092jpeg\u306b\u5909\u63db\u3059\u308b\u65b9\u6cd5\u306f\u3042\u308a\u307e\u3059\u304b<\/a><\/li>\n
![\"\"](\"http:\/\/zairyo.susi.oita-u.ac.jp\/wordpress\/wp-content\/uploads\/2024\/10\/output-300x225.jpeg\")
<\/a><\/p>\n