NPM 包 Nightmare 使用教程-JavaScript中文网-JavaScript教程资源分享门户

Nightmare 是一个基于 Electron 的无头浏览器库，可以用 JavaScript 或 Node.js 控制 Chrome 或 Chromium 浏览器来执行自动化测试、屏幕截图和爬虫等任务。它的 API 简单易用，适用于前端工程师、测试工程师、产品经理等人员。

本文将介绍如何在前端项目中使用 Nightmare，包括安装、基本操作、API 详解及实战示例。

安装

安装 Nightmare 前，请确保已安装 Node.js 和 npm。打开终端，输入以下命令安装 Nightmare：

npm install nightmare

基本操作

Nightmare 支持链式调用，使用起来非常方便。以下是一些基本操作：

打开网页

const Nightmare = require('nightmare');
const nightmare = Nightmare();
nightmare.goto('https://www.google.com');

输入搜索关键词

nightmare.type('input[name="q"]', 'Hello World');

点击按钮

nightmare.click('input[value="Google Search"]');

截屏并保存图片

nightmare.screenshot('screenshot.png')

API 详解

以下是 Nightmare 常用 API 的详细说明：

goto(url)

打开指定网址。

nightmare.goto('https://www.baidu.com');

type(selector, text)

在指定元素中输入文本。

nightmare.type('input[name="wd"]', 'Nightmare');

click(selector)

点击指定元素。

nightmare.click('#su');

evaluate(fn[, arg1, arg2, ...])

在浏览器中执行 JavaScript 代码，并返回结果。

const title = await nightmare.evaluate(() => document.title);

wait(selectorOrTimeout[, timeout])

等待指定元素出现或一定时间后再执行操作。

await nightmare.wait('#content_left');

screenshot([filepath][, clip])

截取当前网页的屏幕截图，并保存为图片文件。

nightmare.screenshot('screenshot.png');

实战示例

以下是一个使用 Nightmare 爬取豆瓣电影 Top250 的示例：

-- -------------------- ---- -------
----- --------- - ---------------------
----- --------- - ----------- ----- ---- ---

------ -- -- -
  --- -
    ----- -------------------------------------------------
      ------------ -- -
        ----- ---- - ---
        ----- ----- - -----------------------------------------------
        --- ---- - - -- - - ------------- ---- -
          ----- ---- - ---------
          ----- ----- - ---------------------------------------
          ----- ------ - --------------------------------------------
          ----- ------- - ----------------------- --------------------------
          ----------- ------ ------- ------- ---
        -
        ------ -----
      --
      ---------- -- ------------------
      ------------ -- ---------------------
      ----------- -- -----------------
  - ----- ------- -
    ---------------------
  -
-----

该代码实现了以下功能：

打开豆瓣电影 Top250 网页。
使用 evaluate 方法获取每个电影的标题、评分和简介。
输出结果到控制台并关闭浏览器。

总结

通过本文的学习，我们了解了如何安装和使用 Nightmare。Nightmare 的 API 丰富，可以完成很多任务，例如自动化测试、屏幕截图、爬虫等。希望这篇文章能为读者提供一些参考和指导。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/42966