Ekstrak maklumat yang berkaitan tentang sambungan Chrome

Question

Saya cuba membina sambungan Chrome yang mengagregatkan maklumat daripada pelbagai tapak web apabila pengguna melawati tapak web A.

async function fetchHTML(url) {
    const response = await fetch(proxyUrl + url);
    const html = await response.text();
    console.log(html);
    return html;
  }

  // 从HTML内容中提取元素 - 总违规次数
  function extractTotalViolations(html) {
    const parser = new DOMParser();
    const doc = parser.parseFromString(html, "text/html");
    const totalViolations = doc.querySelector(".total-violations").textContent;
    return totalViolations;
  }
  
  // 我们想要抓取的页面的URL
  const url = "https://whoownswhat.justfix.org/en/address/MANHATTAN/610/EAST%2020%20STREET";
  
  // 获取页面的HTML内容并提取总违规次数
  fetchHTML(url).then(html => {
    const totalViolations = extractTotalViolations(html);
    console.log(totalViolations);
  });

Apabila saya mencetak totalViolations, saya mendapat NULL. Jadi saya mencetak HTML yang dikikis, dan saya menyedari bahawa saya mendapat beberapa kod JavaScript yang kelihatan sama sekali berbeza daripada kod HTML yang saya lihat secara langsung di tapak web. Saya mengesyaki tapak tersebut menggunakan beberapa penyekat JavaScript atau saya tidak mendapat HTML dengan betul.

<script>
!function(e){function t(t){for(var n,l,i=t[0],f=t[1],a=t[2],p=0,s=[];p<i.length;p++)l=i[p],Object.prototype.hasOwnProperty.call(o,l)&&o[l]&&s.push(o[l][0]),o[l]=0;for(n in f)Object.prototype.hasOwnProperty.call(f,n)&&(e[n]=f[n]);for(c&&c(t);s.length;)s.shift()();return u.push.apply(u,a||[]),r()}function r(){for(var e,t=0;t<u.length;t++){for(var r=u[t],n=!0,i=1;i<r.length;i++){var f=r[i];0!==o[f]&&(n=!1)}n&&(u.splice(t--,1),e=l(l.s=r[0]))}return e}var n={},o={1:0},u=[];function l(t){if(n[t])return n[t].exports;var r=n[t]={i:t,l:!1,exports:{}};return e[t].call(r.exports,r,r.exports,l),r.l=!0,r.exports}l.m=e,l.c=n,l.d=function(e,t,r){l.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},l.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",
</script>

Soalan saya ialah bagaimana untuk mengekstrak HTML dengan betul supaya saya boleh menghuraikan DOM dan mendapatkan semua maklumat daripada tapak web yang saya ingin letakkan pada sambungan. terima kasih.

Answer 1

Bukti fakta bahawa anda mendapat Javascript sebagai respons:

• Permintaan betul
• Anda menerima respons

Ini bermakna anda perlu memuatkan halaman dengan alat pembangun penyemak imbas anda terbuka dan teliti permintaan yang dihantar. Berdasarkan penerangan anda, apabila anda melawat halaman, permintaan pertama yang dihantar mungkin memuatkan kod Javascript, yang kemudiannya diproses dan permintaan selanjutnya dihantar ke pelayan. Kaji permintaan dengan teliti, termasuk URLnya, pengepala permintaan dan muatan serta respons.

Anda perlu menyalin permintaan yang dihantar, dan menghuraikan respons. Jika respons akhirnya menjadi HTML, maka anda boleh menghuraikannya dengan cara yang anda telah cuba (apa perubahan di mana dan cara permintaan dihantar), sebaliknya, jika respons bukan HTML, tetapi sesuatu yang lain, seperti JSON, kemudian lihat lebih dekat pada HTML sasaran yang dipaparkan pada tapak web, dan laksanakan kod yang menukar respons pelayan mentah kepada kod seperti HTML.