Ich schreibe kürzlich einen Crawler, der die Webseite für die Verwendung durch das WeChat-Applet analysieren muss. Sowohl die Text- als auch die Bildanalyse sind leicht verständlich und das Miniprogramm verfügt auch über entsprechende Text- und Bild-Tags zur Präsentation. Komplexere wie Tabellen sind schwieriger. Unabhängig davon, ob es sich um serverseitiges Parsen oder Miniprogramm-Rendering handelt, ist es sehr mühsam und schwierig, alle Situationen abzudecken. Deshalb dachte ich, dass die Konvertierung des HTML-Codes, der der Tabelle entspricht, in Bilder eine Lösung wäre.
Hier verwenden wir das Node-Webshot-Modul, das PhantomJS leicht kapselt und Webseiten einfach als Screenshots speichern kann.
Installieren Sie zuerst Node.js und PhantomJS, erstellen Sie dann eine neue js-Datei und laden Sie das Node-Webshot-Modul:
const webshot = require('webshot');
Optionen definieren:
const options = { // 浏览器窗口 screenSize: { width: 755, height: 25 }, // 要截图的页面文档区域 shotSize: { height: 'all' }, // 网页类型 siteType: 'html' };
Hier sollte die Breite des Browserfensters entsprechend der Situation angemessen eingestellt werden Webseite und die Höhe kann auf einen sehr kleinen Wert eingestellt werden, dann muss die Höhe des Seitendokumentbereichs auf „Alle“ eingestellt werden und die Breite entspricht standardmäßig der Fensterbreite, sodass die Tabelle in der kleinsten Größe vollständig als Screenshot erstellt werden kann .
Als nächstes definieren Sie die HTML-Zeichenfolge:
let html = "target rich text html code, eg: <table>...</table>";
Beachten Sie, dass der HTML-Code in The Der Code muss Zeilenumbrüche entfernen und doppelte Anführungszeichen durch einfache Anführungszeichen ersetzen.
webshot(html, 'demo.png', options, (err) => {if (err)console.log(`Webshot error: ${err.message}`);});
Auf diese Weise wird die Konvertierung vom HTML-Code in ein lokales Bild realisiert, das anschließend in die Qiniu Cloud usw. hochgeladen werden kann. Ob serverseitiges Parsen oder Miniprogramm-Präsentation, es gibt keine Schwierigkeiten.
Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung der komplexen Rich-Text-Analyse in WeChat-Miniprogrammen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!