我有一个editor.html其中包含generatePNG功能：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Diagram</title>
<script type="text/javascript" src="lib/jquery-1.8.1.js"></script>
// <!-- I use many resources -->
<script></script>
<script>
function generatePNG (oViewer) {
var oImageOptions = {
includeDecoratorLayers: false,
replaceImageURL: true
};
var d = new Date();
var h = d.getHours();
var m = d.getMinutes();
var s = d.getSeconds();
var sFileName = "diagram" + h.toString() + m.toString() + s.toString() + ".png";
var sResultBlob = oViewer.generateImageBlob(function(sBlob) {
b = 64;
var reader = new window.FileReader();
reader.readAsDataURL(sBlob);
reader.onloadend = function() {
base64data = reader.result;
var image = document.createElement('img');
image.setAttribute("id", "GraphImage");
image.src = base64data;
document.body.appendChild(image);
}
}, "image/png", oImageOptions);
return sResult;
}
</script>
</head>
<body >
<div id="diagramContainer"></div>
</body>
</html>
我想访问 DOM 并获取image.src使用 Node.js。我发现我可以与cheerio 或jsdom 一起工作。
我从这个开始：
var cheerio = require('cheerio'),
$ = cheerio.load('editor.html');
但我不知道如何访问和获取image.src.
问题是，通过将 html 文件加载到 Cheerio（或任何其他节点模块）中，将不会像浏览器那样处理 HTML。资源（例如样式表、图像和 JavaScript）不会像在浏览器中那样被加载和/或处理。
虽然 Node.js 和现代网络浏览器都有相同（或相似）的 JavaScript 引擎，但是浏览器添加了很多额外的东西，例如window, the DOM (document）， ETC。
Node.js没有这些概念，所以没有window.FileReader nor document.createElement.
如果图像是完全在没有用户交互的情况下创建的（您的代码示例“神奇地”接收到sBlob参数看起来像是一个字符串data:<type>;<encoding>,<data>）您可以在服务器上使用所谓的无头浏览器，PhantomJS这些天似乎最受欢迎。
话又说回来，如果创建不需要用户交互sBlob，您可能最好使用纯 Node.js 解决方案，例如如何在 Node 中解析数据 URL？.
如果创建需要某种用户交互sBlob，并且您需要将其存储在服务器上，您可以使用与提到的几乎相同的解决方案，只需发送sBlob使用 Ajax 或 websocket 到服务器，处理sBlob转换为图像并（可选）返回在其中查找图像的 URL。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
