Использование PhantomJS для встраивания всех изображений веб-страницы выдает предупреждения, но работает
Я пытаюсь преобразовать веб-страницу в один файл, внедрив все изображения (и другие внешние ресурсы после прохождения этой точки). Вот как я запускаю PhantomJs:
./phantomjs --web-security=false ./embed_images.js http://localhost/index.html > output.txt
И вотembed_images.js
:
var page = require('webpage').create(),
system = require('system'),
address;
if (system.args.length === 1) {
console.log('Usage: embed_images.js <some URL>');
phantom.exit(1);
}
else {
page.onConsoleMessage = function(msg) {
console.log(msg);
};
address = system.args[1];
page.open(address, function(status) {
page.evaluate(function() {
function embedImg(org) {
var img = new Image();
img.src = org.src;
img.onload = function() {
var canvas = document.createElement("canvas");
canvas.width = this.width;
canvas.height = this.height;
var ctx = canvas.getContext("2d");
ctx.drawImage(this, 0, 0);
var dataURL = canvas.toDataURL("image/png");
org.src = dataURL;
console.log(dataURL);
}
}
var imgs = document.getElementsByTagName("img");
for (var index=0; index < imgs.length; index++) {
embedImg(imgs[index]);
}
});
phantom.exit()
});
}
Когда я запускаю упомянутую команду, это приводит к файлу как это:
Unsafe JavaScript attempt to access frame with URL from frame with URL file://./embed_images.js. Domains, protocols and ports must match.
Unsafe JavaScript attempt to access frame with URL about:blank from frame with URL file://./embed_images.js. Domains, protocols and ports must match.
Есть несколько случаев вышеупомянутого сообщения об ошибке. Чтобы проверить, что не так, я запустил приведенный ниже код в консоли моего Chromium:
function embedImg(org) {
var img = new Image();
img.src = org.src;
img.onload = function() {
var canvas = document.createElement("canvas");
canvas.width = this.width;
canvas.height = this.height;
var ctx = canvas.getContext("2d");
ctx.drawImage(this, 0, 0);
var dataURL = canvas.toDataURL("image/png");
org.src = dataURL;
console.log(dataURL);
}
}
var imgs = document.getElementsByTagName("img");
for (var index=0; index < imgs.length; index++) {
embedImg(imgs[index]);
}
И это работает просто отлично (моя веб-страница не содержит ссылок на междоменные изображения)! Все изображения будут вставлены в HTML-страницу. Кто-нибудь знает, в чем может быть проблема?
Вот мойindex.html
содержимое файла:
<!DOCTYPE html >
<html>
<head>
<meta charset="utf-8" />
</head>
<body>
<img src="1.png" >
</body>
</html>
И фактический вывод (output.txt
):
Unsafe JavaScript attempt to access frame with URL from frame with URL file://./embed_images.js. Domains, protocols and ports must match.
Unsafe JavaScript attempt to access frame with URL from frame with URL file://./embed_images.js. Domains, protocols and ports must match.
Unsafe JavaScript attempt to access frame with URL about:blank from frame with URL file://./embed_images.js. Domains, protocols and ports must match.
Unsafe JavaScript attempt to access frame with URL about:blank from frame with URL file://./embed_images.js. Domains, protocols and ports must match.
Unsafe JavaScript attempt to access frame with URL about:blank from frame with URL file://./embed_images.js. Domains, protocols and ports must match.
Unsafe JavaScript attempt to access frame with URL about:blank from frame with URL file://./embed_images.js. Domains, protocols and ports must match.
Unsafe JavaScript attempt to access frame with URL about:blank from frame with URL file://./embed_images.js. Domains, protocols and ports must match.
Unsafe JavaScript attempt to access frame with URL about:blank from frame with URL file://./embed_images.js. Domains, protocols and ports must match.
Unsafe JavaScript attempt to access frame with URL about:blank from frame with URL file://./embed_images.js. Domains, protocols and ports must match.
Unsafe JavaScript attempt to access frame with URL about:blank from frame with URL file://./embed_images.js. Domains, protocols and ports must match.
Unsafe JavaScript attempt to access frame with URL about:blank from frame with URL file://./embed_images.js. Domains, protocols and ports must match.
Странно то, что, хотя у меня есть только одно изображение на моей странице, есть множество сообщений об ошибках!
я используюphantomjs-1.9.8-Linux-x86_64.