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
Lepaskan: 2025-01-22 10:33:12
asal
424 orang telah melayarinya

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>
Salin selepas log masuk
Salin selepas log masuk

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>
Salin selepas log masuk
Salin selepas log masuk
<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>
Salin selepas log masuk
Salin selepas log masuk

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>
Salin selepas log masuk
Salin selepas log masuk

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>
Salin selepas log masuk
Salin selepas log masuk

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>
Salin selepas log masuk
Salin selepas log masuk

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>
Salin selepas log masuk
Salin selepas log masuk

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>
Salin selepas log masuk
Salin selepas log masuk

Memulakan komponen:

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

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>
Salin selepas log masuk
Salin selepas log masuk

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!

sumber:php.cn
Kenyataan Laman Web ini
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
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan