手动下载Chrome并解决puppeteer无法使用问题


Posted in Javascript onNovember 12, 2018

因为网络原因,国内安装 puppeteer 的时候会报网络超时。这里使用 puppeteer-core 之后使用手动下载的 Chrome 进行操作。思路很简单,安装一个不带浏览器的 puppeteer ,再使用的时候将浏览器地址指向一个可执行的 Chrome 浏览器文件。

安装

安装 puppeteer-core

yarn add puppeteer-core

找到 puppeteer 中对应的浏览器并下载

node_modules/puppeteer-core/lib/BrowserFetcher.js 中找到各平台 Chrome 下载地址。其中 %s 替换为 DEFAULT_DOWNLOAD_HOST 的值, %d 替换为版本号。

手动下载Chrome并解决puppeteer无法使用问题

node_modules/puppeteer-core/packages.json 中找到版本号

手动下载Chrome并解决puppeteer无法使用问题

替换后得到下载地址

https://storage.googleapis.com/chromium-browser-snapshots/Mac/579032/chrome-mac.zip

下载后解压,放在项目目录中,这里我放在 chrome 下。

使用

这样就可以使用了。

使用代码

const puppeteer = require('puppeteer-core');
const path = require('path');

(async () => {
 const browser = await puppeteer.launch({
  // 这里注意路径指向可执行的浏览器。
  // 各平台路径可以在 node_modules/puppeteer-core/lib/BrowserFetcher.js 中找到
  // Mac 为 '下载文件解压路径/Chromium.app/Contents/MacOS/Chromium'
  // Linux 为 '下载文件解压路径/chrome'
  // Windows 为 '下载文件解压路径/chrome.exe'
  executablePath: path.resolve('./chrome/Chromium.app/Contents/MacOS/Chromium')
 });
 const page = await browser.newPage();
 await page.setViewport({
  width: 375,
  height: 667,
  deviceScaleFactor: 1,
  isMobile: true
 })
 await page.goto('https://marxjiao.com/');
 await page.screenshot({path: 'marx-blog.png'});
 await browser.close();
})();

执行文件

node index.js

执行后可看到,图片已经截图出来了

手动下载Chrome并解决puppeteer无法使用问题

代码地址:https://github.com/MarxJiao/puppeteer-test

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
关于js注册事件的常用方法
Apr 03 Javascript
JS数组去重与取重的示例代码
Jan 24 Javascript
JavaScript将XML转成JSON的方法
Mar 12 Javascript
jquery实现美观的导航菜单鼠标提示特效代码
Sep 06 Javascript
js判断某个字符出现的次数的简单实例
Jun 03 Javascript
Google 地图类型详解及示例代码
Aug 06 Javascript
textarea 在浏览器中固定大小和禁止拖动的实现方法
Dec 03 Javascript
webpack打包单页面如何引用的js
Jun 07 Javascript
jquery插件开发之选项卡制作详解
Aug 30 jQuery
Vue.js+cube-ui(Scroll组件)实现类似头条效果的横向滚动导航条
Jun 24 Javascript
JS实现在线ps功能详解
Jul 31 Javascript
CKEditor扩展插件:自动排版功能autoformat插件实现方法详解
Feb 06 Javascript
vue elementui form表单验证的实现
Nov 11 #Javascript
跨域请求两种方法 jsonp和cors的实现
Nov 11 #Javascript
浅谈webpack+react多页面开发终极架构
Nov 11 #Javascript
Vue项目引进ElementUI组件的方法
Nov 11 #Javascript
webpack中如何使用雪碧图的示例代码
Nov 11 #Javascript
vue组件从开发到发布的实现步骤
Nov 11 #Javascript
详解如何在Node.js的httpServer中接收前端发送的arraybuffer数据
Nov 11 #Javascript
You might like
php如何利用pecl安装mongodb扩展详解
2019/01/09 PHP
JavaScript等比例缩放图片控制超出范围的图片
2013/08/06 Javascript
JavaScript实现简单的时钟实例代码
2013/11/23 Javascript
js 跳出页面的frameset框架示例介绍
2013/12/23 Javascript
浅析javascript中function 的 length 属性
2014/05/27 Javascript
完美兼容多浏览器的js判断图片路径代码汇总
2015/04/17 Javascript
js代码实现无缝滚动(文字和图片)
2015/08/20 Javascript
解决拦截器对ajax请求的拦截实例详解
2016/12/21 Javascript
浅谈Vuejs Prop基本用法
2017/08/17 Javascript
ES6解构赋值的功能与用途实例分析
2017/10/31 Javascript
vue addRoutes实现动态权限路由菜单的示例
2018/05/15 Javascript
微信小程序人脸识别功能代码实例
2019/05/07 Javascript
使用VueCli3+TypeScript+Vuex一步步构建todoList的方法
2019/07/25 Javascript
JavaScript 正则应用详解【模式、欲查、反向引用等】
2020/05/13 Javascript
vue+animation实现翻页动画
2020/06/29 Javascript
[48:48]完美世界DOTA2联赛PWL S3 Magama vs GXR 第一场 12.19
2020/12/24 DOTA
python正则表达式抓取成语网站
2013/11/20 Python
python模拟鼠标拖动操作的方法
2015/03/11 Python
浅谈python函数之作用域(python3.5)
2017/10/27 Python
如何利用Python模拟GitHub登录详解
2019/07/15 Python
基于python爬取链家二手房信息代码示例
2020/10/21 Python
Python爬虫+tkinter界面实现历史天气查询的思路详解
2021/02/22 Python
CSS3属性box-sizing使用指南
2014/12/09 HTML / CSS
html5定制表单_动力节点Java学院整理
2017/07/11 HTML / CSS
会走动的图形html5时钟示例
2014/04/27 HTML / CSS
照片礼物和装饰:MyPhoto
2019/11/02 全球购物
项目专员岗位职责
2013/12/04 职场文书
党课学习思想汇报
2014/01/02 职场文书
先进个人事迹材料
2014/01/25 职场文书
搞笑爱情保证书
2014/04/29 职场文书
胡雪岩故居导游词
2015/02/06 职场文书
总经理聘用协议书
2015/09/21 职场文书
《我和小伙伴》教学反思
2016/02/20 职场文书
解决sql server 数据库,sa用户被锁定的问题
2021/06/11 SQL Server
基于Java的MathML转图片的方法(示例代码)
2021/06/23 Java/Android
十大最强妖精系宝可梦,哲尔尼亚斯实力最强,第五被称为大力士
2022/03/18 日漫