Я пытаюсь загрузить всю веб-страницу с помощью JavaScript, подключив URL-адрес. Тем не менее, веб-сайт построен как одностраничное приложение (SPA), которое использует JavaScript/backbone.js для динамической загрузки большей части содержимого после рендеринга начальный ответ.
Так, например, когда я направляюсь на следующий адрес:
https://connect.garmin.com/modern/activity/1915361012
И затем введите это в консоль (после загрузки страницы):
var $page = $("html")
console.log("%c✔: ", "color:green;", $page.find(".inline-edit-target.page-title-overflow").text().trim());
console.log("%c✔: ", "color:green;", $page.find("footer .details").text().trim());
Затем я получу динамически загруженный заголовок активности, а также статически загруженный нижний колонтитул страницы:
Однако, когда я пытаюсь загрузить веб-страницу с помощью вызова AJAX с помощью $.get() или .load(), я получаю только исходный ответ (то же, что и контент при просмотре источника):
view-source:https://connect.garmin.com/modern/activity/1915361012
Итак, если я использую один из следующих вызовов AJAX:
// jQuery.get()
var url = "https://connect.garmin.com/modern/activity/1915361012";
jQuery.get(url,function(data) {
var $page = $("<div>").html(data)
console.log("%c✖: ", "color:red;", $page.find(".page-title").text().trim());
console.log("%c✔: ", "color:green;", $page.find("footer .details").text().trim());
});
// jQuery.load()
var url = "https://connect.garmin.com/modern/activity/1915361012";
var $page = $("<div>")
$page.load(url, function(data) {
console.log("%c✖: ", "color:red;", $page.find(".page-title").text().trim() );
console.log("%c✔: ", "color:green;", $page.find("footer .details").text().trim());
});
Я по-прежнему получаю начальный нижний колонтитул, но не получаю никакого другого содержимого страницы:
Я пробовал решение здесь до eval() содержимого каждого тега script, но это не отображается достаточно надежный, чтобы загрузить страницу:
jQuery.get(url,function(data) {
var $page = $("<div>").html(data)
$page.find("script").each(function() {
var scriptContent = $(this).html(); //Grab the content of this tag
eval(scriptContent); //Execute the content
});
console.log("%c✖: ", "color:red;", $page.find(".page-title").text().trim());
console.log("%c✔: ", "color:green;", $page.find("footer .details").text().trim());
});
Q: Есть ли какие-либо опции для полной загрузки веб-страницы, которая будет подвержена JavaScript?
