Попытка загрузить все изображения поиска Google, используя javascript

Question

Я пытаюсь создать сценарий, который загружает все изображения поиска Google для создания набора данных моего проекта ml. Я следовал этому учебнику , чтобы загрузить изображение с высоким разрешением, но внезапно появляется ошибка, которая говорит:

Отказался загружать скрипт 'https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js 'потому что он нарушает следующую директиву политики безопасности содержимого: "script-sr c' report-sample '' nonce-Q6xQOKx7e + e0TlGbQFPX3g '' unsafe-inline '". Обратите внимание, что 'script-sr c -elem' не был задан явно, поэтому 'script-sr c' используется в качестве запасного варианта

Некоторая помощь будет принята с благодарностью. Я запускаю этот код, вставляя его в консоль javascript. Спасибо!

var script = document.createElement('script');
script.src = "https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js";
document.getElementsByTagName('head')[0].appendChild(script);

// grab the URLs
var urls = $('.rg_di .rg_meta').map(function() {
  return JSON.parse($(this).text()).ou;
});

// write the URls to file (one per line)
var textToSave = urls.toArray().join('\n');
var hiddenElement = document.createElement('a');
hiddenElement.href = 'data:attachment/text,' + encodeURI(textToSave);
hiddenElement.target = '_blank';
hiddenElement.download = 'urls.txt';
hiddenElement.click();

Answer 1

Вы используете jQuery для чего-то, что может быть сделано в нативном javascript.

document.querySelectorAll работает с селекторами в основном как jQuery. Он не возвращает массив, но (на мой взгляд) громоздкий NodeList .

Чтобы правильно выполнить итерацию, я предпочитаю распространять в массив и затем вызовите forEach на нем.

[...document.querySelectorAll('.foo')].forEach((element, index) => {
   console.log(element.innerText);
});

<div class="foo">bar</div>
<div class="foo">baz</div>
<div class="foo">bal</div>

Кроме того, метод получения данных в настоящее время различен.

На всех изображениях вам нужно сначала вызвать щелчок.
Это активирует javascript обработчики событий, которые будут устанавливать href изображения деда.
Вам нужно разрешить запускать обработчики событий Google во-первых, мы отсоединяем оставшуюся часть нашего потока выполнения, чтобы скрипт Google мог сделать свое дело и обновить DOM. Мы делаем это с помощью setTimeout () .
Затем, когда скрипты Google запустились, элементы DOM были обновлены, наши запланированные тайм-ауты получили шанс на запуск, и теперь href заполнены.

До щелчка ссылка выглядит следующим образом:

после нажатия

теперь мы видим, что HREF был заселен. Введенный URL:

https://www.google.com/imgres?imgurl=https%3A%2F%2Fwww.researchgate.net%2Fprofile%2FJerome_Droniou%2Fpublication%2F305983658%2Ffigure%2Ffig5%2FAS%3A668650201690119%401536430039650%2FMesh-patterns-for-the-tests-using-the-HMM-method-left-Test-1-right-Test-2.png&imgrefurl=https%3A%2F%2Fwww.researchgate.net%2Ffigure%2FMesh-patterns-for-the-tests-using-the-HMM-method-left-Test-1-right-Test-2_fig5_305983658&tbnid=_UuLNMPCQAT0uM&vet=12ahUKEwjhsu31zcnoAhWbgKQKHR3jAdUQMygAegUIARDTAQ..i&docid=LThLi5REXoitfM&w=428&h=428&q=hmm%20test&ved=2ahUKEwjhsu31zcnoAhWbgKQKHR3jAdUQMygAegUIARDTAQ

В этом URL мы видим после imgurl= что-то, начинающееся с https. Это наш целевой URL-адрес изображения, но он был закодирован и является частью большего URL-адреса.
Таким образом, мы манипулируем строкой с помощью простой подстроки.

Тогда у нас все еще есть странные символы

https% 3A% 2F% 2F www.researchgate.net%2Fprofile%2FJerome_Droniou%2Fpublication%2F305983658%2Ffigure%2Ffig5%2FAS%3A668650201690119%401536430039650%2FMesh-patterns-for-the-tests-using-the-HMM-method-left-Test-1-right-Test-2.png

, для этого мы можем использовать decodeURIComponent () , чтобы преобразовать его в обычный URL

document.write(decodeURIComponent('https%3A%2F%2Fwww.researchgate.net%2Fprofile%2FJerome_Droniou%2Fpublication%2F305983658%2Ffigure%2Ffig5%2FAS%3A668650201690119%401536430039650%2FMesh-patterns-for-the-tests-using-the-HMM-method-left-Test-1-right-Test-2.png'))

Затем мы добавляем это в наш массив.

Когда мы обработаем все, мы создадим файл urls и загрузим его.

var urls = [];
var count = 0;
[...document.querySelectorAll('.rg_i')].forEach((element, index) => {
   let el = element.parentElement.parentElement;
   el.click();
   count++;
   setTimeout(() => {
       let google_url = el.href;

       let start = google_url.indexOf('=' , google_url.indexOf('imgurl'))+1;
       let encoded = google_url.substring(start, google_url.indexOf('&', start));
       let url = decodeURIComponent(encoded);
       urls.push(url);
       console.log(count);
       if(--count == 0) {
          let textToSave = urls.join('\n');
          let hiddenElement = document.createElement('a');
          hiddenElement.href = 'data:attachment/text,' + encodeURI(textToSave);
          hiddenElement.target = '_blank';
          hiddenElement.download = 'urls.txt';
          hiddenElement.click();
       }

   }, 50);

});

Answer 2

Отказ от загрузки скрипта вызван тем, что Content Security Policy. В Firefox вы можете отключить csp с помощью about: config в строке URL и установить для security.csp.enable значение false.

Я пытался протестировать приведенный ниже код в консоли Firefox:

    javascript: (function(e, s) {
    e.src = s;
    e.onload = function() {
        jQuery.noConflict();
        console.log('jQuery injected');

        jQuery(".rg_i").get().forEach(function(entry, index, array) {
        var src = jQuery('.rg_i').attr('src');
        console.log("src1: " + src);
        });

        var src = jQuery('.rg_i').attr('src');
        console.log("src2: " + src);
    };
    document.head.appendChild(e);

})(document.createElement('script'), '//ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js');

Удачи:)

Answer 3

Я думаю, вам нужно добавить что-то вроде этого:

<meta http-equiv="Content-Security-Policy" content="default-src https://cdn.example.net; child-src 'none'; object-src 'none'">

Добавить его в Политики, есть много разных способов (см. Документы).