我需要从第三方javascript插入DOM的音频标签中读取src属性(所以我无法修改它)。必须从服务器端为多个页面完成,因为目标是通过读取源并将它们保存在服务器上来备份这些声音。
我到目前为止所尝试的是将Node.js与jsdom / cheerio / phantom一起使用,但它们似乎都没有做到这一点,因为调用是在插入元素之前完成的。
这是幽灵代码:
var phantom = require( 'phantom' );
var http = require('http');
var fs = require('fs');
phantom.create(function(ph) {
return ph.createPage(function(page){
page.open("https://mysite.cc/some-url", function(status) {
console.log("opened site? ", status);
page.injectJs('http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' , function() {
//jQuery Loaded.
//Wait for a bit for AJAX content to load on the page. Here, we are waiting 5 seconds.
setTimeout(function() {
return page.evaluate(function() {
var src = $("#audio_box").attr("src");
return {
src : src
};
}, function(result) {
console.log(result);
ph.exit();
});
}, 50000);
});
});
});
});
这是jsdom代码:
var request = require('request'),
jsdom = require('jsdom');
jsdom.defaultDocumentFeatures = {
FetchExternalResources : ['script'],
ProcessExternalResources : ['script'],
MutationEvents : '2.0',
QuerySelector : false
};
request({ uri:'https://mysite.cc/some-url' }, function (error, response, body) {
if (error && response.statusCode !== 200) {
console.log('Error when contacting google.com');
}
jsdom.env({
html: body,
scripts: [
'http://code.jquery.com/jquery-1.5.min.js'
],
done: function (err, window) {
var $ = window.jQuery;
var audio = $('#audio_box');
console.log(audio);
}
});
});
我阅读了有关屏幕报废的所有内容,但我找不到任何有关服务器端解决方案的明确答案,这些解决方案等待网站脚本完全加载或允许侦听DOM更改或类似内容。< / p>
即使它意味着使用其他语言,我也很乐意有一个解决方案,所以任何经验都有帮助!
修改
我找到了一个解决方案,但它是一个非常脏的解决方案,所以如果有人有更好的解决方案我会留下问题。
我现在正在做的是我在PHP中使用curl请求获取页面,在body标记的末尾注入一个jquery脚本并使其等待几秒钟,然后重新收集所有数据party js注入,并且ajax将其发布到我的服务器中的另一个URL,该URL捕获数据并执行备份过程。 由于某种原因,数据从未插入非人工界面(可能是某些用户代理检查),因此我不得不向浏览器询问此过程中的一些帮助。
答案 0 :(得分:0)
假设视频元素插入特定的div元素下,比如'video-element', 您可以将DOMNodeInsertedIntoDocument事件视为;
$('.video-element').on('DOMNodeInsertedIntoDocument', function(){ ... })
或者您可以使用名为livequery的库来实现相同的目标。
它的作用是,只要在'video-element'下发生新的dom元素插入,它就会触发'DOMNodeInsertedIntoDocument'事件。