手动下载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 相关文章推荐
基于jquery的滑动样例代码
Nov 20 Javascript
使用node.js 制作网站前台后台
Nov 13 Javascript
深入理解JavaScript编程中的原型概念
Jun 25 Javascript
基于JS实现PHP的sprintf函数实例
Nov 14 Javascript
一篇文章掌握RequireJS常用知识
Jan 26 Javascript
jquery.validate[.unobtrusive]和Bootstrap实现tooltip错误提示问题分析
Oct 30 Javascript
js对字符串进行编码的方法总结(推荐)
Nov 10 Javascript
AngularJS2中一种button切换效果的实现方法(二)
Mar 27 Javascript
jQuery获取单选按钮radio选中值与去除所有radio选中状态的方法
May 20 jQuery
在Vue.js中使用Mixins的方法
Sep 12 Javascript
vue + typescript + video.js实现 流媒体播放 视频监控功能
Jul 07 Javascript
Vue-axios-post数据后端接不到问题解决
Jan 09 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 中文乱码解决办法总结分析
2009/07/30 PHP
php cookie的操作实现代码(登录)
2010/12/29 PHP
基于jQuery的固定表格头部的代码(IE6,7,8测试通过)
2010/05/18 Javascript
javascript常用对话框小集
2013/09/13 Javascript
javascript不同类型数据之间的运算的转换方法
2014/02/13 Javascript
[将免费进行到底]在Amazon的一年免费服务器上安装Node.JS, NPM和OurJS博客
2014/08/18 Javascript
AngularJs bootstrap搭载前台框架——js控制部分
2016/09/01 Javascript
AngularJs  Understanding Angular Templates
2016/09/02 Javascript
Angular.js基础学习之初始化
2017/03/10 Javascript
基于JavaScript实现活动倒计时效果
2017/04/20 Javascript
深入理解Angular.JS中的Scope继承
2017/06/04 Javascript
JS中把函数作为另一函数的参数传递方法(总结)
2017/06/28 Javascript
vue父组件向子组件动态传值的两种方法
2017/11/11 Javascript
vue2.0组件之间传值、通信的多种方式(干货)
2018/02/10 Javascript
详解Node.JS模块 process
2020/08/31 Javascript
[02:10]DOTA2亚洲邀请赛 EG战队出场宣传片
2015/02/07 DOTA
python实现udp数据报传输的方法
2014/09/26 Python
python虚拟环境virtualenv的使用教程
2017/10/20 Python
Python实现识别手写数字大纲
2018/01/29 Python
Windows 7下Python Web环境搭建图文教程
2018/03/20 Python
python计算日期之间的放假日期
2018/06/05 Python
python进阶之自定义可迭代的类
2019/08/20 Python
python 函数的缺省参数使用注意事项分析
2019/09/17 Python
python 实现二维列表转置
2019/12/02 Python
13个Pandas实用技巧,助你提高开发效率
2020/08/19 Python
使用CSS3的rem属性制作响应式页面布局的要点解析
2016/05/24 HTML / CSS
amaze ui 的使用详细教程
2020/08/19 HTML / CSS
加拿大租车网站:Enterprise Rent-A-Car
2018/07/26 全球购物
Tuckernuck官网:经典的美国品质服装、鞋子和配饰
2021/01/11 全球购物
总经理司机岗位职责
2014/02/06 职场文书
幼儿园小班教师寄语
2014/04/03 职场文书
理财计划书
2014/08/14 职场文书
自我查摆剖析材料
2014/10/11 职场文书
办公室日常管理制度
2015/08/04 职场文书
周末问候语大全
2015/11/10 职场文书
浅谈Python协程asyncio
2021/06/20 Python