Rumah >hujung hadapan web >tutorial js >Bersihkan Kandungan HTML untuk Penjanaan Pertambahan Pendapatan dengan Kebolehbacaan.js

Bersihkan Kandungan HTML untuk Penjanaan Pertambahan Pendapatan dengan Kebolehbacaan.js

Barbara Streisand
Barbara Streisandasal
2025-01-22 10:33:12384semak imbas

Mengikis web ialah kaedah biasa untuk mengumpul kandungan untuk aplikasi penjanaan dipertingkatkan semula (RAG) anda. Walau bagaimanapun, menghuraikan kandungan halaman web boleh mencabar.

Pustaka Readability.js sumber terbuka Mozilla menawarkan penyelesaian yang mudah untuk mengekstrak bahagian penting halaman web sahaja. Mari kita terokai penyepaduannya ke dalam saluran paip pengingesan data untuk aplikasi RAG.

Mengekstrak Data Tidak Berstruktur daripada Halaman Web

Halaman web ialah sumber yang kaya dengan data tidak berstruktur, sesuai untuk aplikasi RAG. Walau bagaimanapun, halaman web selalunya mengandungi maklumat yang tidak berkaitan seperti pengepala, bar sisi dan pengaki. Walaupun berguna untuk menyemak imbas, kandungan tambahan ini menjejaskan subjek utama halaman.

Untuk data RAG yang optimum, kandungan yang tidak berkaitan mesti dialih keluar. Walaupun alat seperti Cheerio boleh menghuraikan HTML berdasarkan struktur tapak yang diketahui, pendekatan ini tidak cekap untuk mengikis reka letak laman web yang pelbagai. Kaedah yang mantap diperlukan untuk mengekstrak kandungan yang berkaitan sahaja.

Memanfaatkan Fungsi Paparan Pembaca

Kebanyakan penyemak imbas menyertakan paparan pembaca yang mengalih keluar semua kecuali tajuk dan kandungan artikel. Imej berikut menggambarkan perbezaan antara penyemakan imbas standard dan mod pembaca yang digunakan pada catatan blog DataStax:

Clean up HTML Content for Retrieval-Augmented Generation with Readability.js

Mozilla menyediakan Readability.js, perpustakaan di sebalik mod pembaca Firefox, sebagai modul sumber terbuka kendiri. Ini membolehkan kami menyepadukan Readability.js ke dalam saluran paip data untuk mengalih keluar kandungan yang tidak berkaitan dan menambah baik hasil mengikis.

Mengikis Data dengan Node.js dan Readability.js

Mari kita gambarkan mengikis kandungan artikel daripada catatan blog sebelumnya tentang membuat pembenaman vektor dalam Node.js. Kod JavaScript berikut mendapatkan semula HTML halaman:

<code class="language-javascript">const html = await fetch(
  "https://www.datastax.com/blog/how-to-create-vector-embeddings-in-node-js"
).then((res) => res.text());
console.log(html);</code>

Ini termasuk semua HTML, termasuk navigasi, pengaki dan elemen lain yang biasa di tapak web.

Sebagai alternatif, anda boleh menggunakan Cheerio untuk memilih elemen tertentu:

<code class="language-javascript">npm install cheerio</code>
<code class="language-javascript">import * as cheerio from "cheerio";

const html = await fetch(
  "https://www.datastax.com/blog/how-to-create-vector-embeddings-in-node-js"
).then((res) => res.text());

const $ = cheerio.load(html);

console.log($("h1").text(), "\n");
console.log($("section#blog-content > div:first-child").text());</code>

Ini menghasilkan tajuk dan teks artikel. Walau bagaimanapun, pendekatan ini bergantung pada mengetahui struktur HTML, yang tidak selalunya boleh dilaksanakan.

Pendekatan yang lebih baik melibatkan pemasangan Readability.js dan jsdom:

<code class="language-bash">npm install @mozilla/readability jsdom</code>

Kebolehbacaan.js beroperasi dalam persekitaran penyemak imbas, memerlukan jsdom untuk mensimulasikan ini dalam Node.js. Kami boleh menukar HTML yang dimuatkan kepada dokumen dan menggunakan Readability.js untuk menghuraikan kandungan:

<code class="language-javascript">import { Readability } from "@mozilla/readability";
import { JSDOM } from "jsdom";

const url = "https://www.datastax.com/blog/how-to-create-vector-embeddings-in-node-js";
const html = await fetch(url).then((res) => res.text());

const doc = new JSDOM(html, { url });
const reader = new Readability(doc.window.document);
const article = reader.parse();

console.log(article);</code>

Objek article mengandungi pelbagai elemen yang dihuraikan:

Clean up HTML Content for Retrieval-Augmented Generation with Readability.js

Ini termasuk tajuk, pengarang, petikan, masa penerbitan dan kedua-dua HTML (content) dan teks biasa (textContent). textContent sedia untuk dipotong, dibenamkan dan penyimpanan, manakala content mengekalkan pautan dan imej untuk pemprosesan selanjutnya.

Fungsi isProbablyReaderable membantu menentukan sama ada dokumen itu sesuai untuk Kebolehbacaan.js:

<code class="language-javascript">const html = await fetch(
  "https://www.datastax.com/blog/how-to-create-vector-embeddings-in-node-js"
).then((res) => res.text());
console.log(html);</code>

Halaman yang tidak sesuai harus dibenderakan untuk semakan.

Mengintegrasikan Kebolehbacaan dengan LangChain.js

Kebolehbacaan.js disepadukan dengan lancar dengan LangChain.js. Contoh berikut menggunakan LangChain.js untuk memuatkan halaman, mengekstrak kandungan dengan MozillaReadabilityTransformer, memisahkan teks dengan RecursiveCharacterTextSplitter, mencipta benam dengan OpenAI dan menyimpan data dalam Astra DB.

Kebergantungan yang diperlukan:

<code class="language-javascript">npm install cheerio</code>

Anda memerlukan bukti kelayakan Astra DB ( ASTRA_DB_APPLICATION_TOKEN, ASTRA_DB_API_ENDPOINT) dan kunci API OpenAI (OPENAI_API_KEY) sebagai pembolehubah persekitaran.

Import modul yang diperlukan:

<code class="language-javascript">import * as cheerio from "cheerio";

const html = await fetch(
  "https://www.datastax.com/blog/how-to-create-vector-embeddings-in-node-js"
).then((res) => res.text());

const $ = cheerio.load(html);

console.log($("h1").text(), "\n");
console.log($("section#blog-content > div:first-child").text());</code>

Memulakan komponen:

<code class="language-bash">npm install @mozilla/readability jsdom</code>

Muat, ubah, belah, benamkan dan simpan dokumen:

<code class="language-javascript">import { Readability } from "@mozilla/readability";
import { JSDOM } from "jsdom";

const url = "https://www.datastax.com/blog/how-to-create-vector-embeddings-in-node-js";
const html = await fetch(url).then((res) => res.text());

const doc = new JSDOM(html, { url });
const reader = new Readability(doc.window.document);
const article = reader.parse();

console.log(article);</code>

Ketepatan Mengikis Web dipertingkat dengan Kebolehbacaan.js

Readability.js, perpustakaan teguh yang menjanakan mod pembaca Firefox, mengekstrak data yang berkaitan dengan cekap daripada halaman web, meningkatkan kualiti data RAG. Ia boleh digunakan secara terus atau melalui MozillaReadabilityTransformer LangChain.js.

Ini hanyalah peringkat awal saluran paip pengingesan anda. Pecahan, pembenaman dan storan Astra DB ialah langkah seterusnya dalam membina aplikasi RAG anda.

Adakah anda menggunakan kaedah lain untuk membersihkan kandungan web dalam aplikasi RAG anda? Kongsi teknik anda!

Atas ialah kandungan terperinci Bersihkan Kandungan HTML untuk Penjanaan Pertambahan Pendapatan dengan Kebolehbacaan.js. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn