Offiziell eingebaute Funktion zum Herunterladen von Produktdiagrammen, SKU-Diagrammen und Detail-Diagrammen auf einer E-Commerce-Website mit einem Klick und Unterstützung für die benutzerdefinierte Extraktion von HD-Bildern.
Mit der benutzerdefinierten JSON-Vorlagenkonfiguration können reguläre Ausdrücke für den Webseitencode einer Website konfiguriert werden, so dass das Plugin die unterstützten Websites dynamisch erweitern kann.
Leser und Benutzer dieses Artikels müssen folgende Fähigkeiten besitzen:
Verstehen Sie grundlegende Frontend-Technologien wie HTML, JavaScript, CSS und AJAX, um die Struktur der Webseite und die Codelogik besser zu verstehen und die Grundlage für die Konfiguration von regulären Ausdrücken zu schaffen.
2. Kompetenz mit den Entwickler-Tools des Chrome-Browsers für die Webanalyse, Debugging und die Anzeige der Codestruktur, um den Konfigurationsprozess zu unterstützen. Fähigkeit, reguläre Ausdrücke und Werkzeuge zu verwenden, die Syntax und Regeln regulärer Ausdrücke zu beherrschen, um den gewünschten Webinhalt genau zu extrahieren.
3. Haben Sie die Fähigkeit, selbst zu lernen und Probleme zu lösen, können Sie proaktiv lernen und Lösungen erforschen, wenn Probleme während der Verwendung auftreten, um sicherzustellen, dass die Konfigurationsarbeit reibungslos abgeschlossen wird.
Nutzungsszenen
Schritt 1:Bestätigen Sie das Bild, das Sie sammeln möchten Dom Struktur
Öffnen Sie F12 auf der entsprechenden Website und finden Sie die entsprechende Comic-Struktur, wie in der Abbildung unten gezeigt.
Aus dem Diagramm ist der aktuelle Selektor
#comicContain img
Schlussfolgerung der Liste der herunterladbaren wie folgt:
[...document.querySelectorAll(`#comicContain img`)].map(o => o.src)
Auf der Konsole sichtbar:
Schritt 2:Vorlage ausfüllen
Universal Comics Download-Vorlagen und natürlich komplexere Szenen:
{
"id": 90005,
"name": "Tencent Comics",
"ico": "https://oss.floweb.cn/ac.qq.com",
"version": "24.12.01",
"description": "Unterstützt den Download von Bildern von ac.qq.com mit einem Klick",
"reg": "ac.qq.com",
"tags": [
"manhua"
],
"status": "prod",
"examples": [
"https://ac.qq.com/ComicView/index/id/543584/cid/1"
],
"groups": [
{
"fn": "updateGroupByIds",
"props": {
"groupName": "Kapitel",
"groupIndex": 1,
"source": "[...document.querySelectorAll(`#comicContain img`)].map(o => o.src)",
"ids": [
{
"attributes": [],
"replaceUrlRules": [
{
"pattern": "!q.*$",
"replaceValue": "?desc"
}
]
}
]
}
}
]
}
Besondere Aufmerksamkeit
- ID: keine wiederholte ID
- status: als prod angegeben
Aktuelle Schlüsselwörter sind: source
Tipp: Dynamische Icon-Generierung mit dem floweb-Tool. www.floweb.cn
Zum intelligenten Skript hinzufügen:
Schritt 3:Benutzerdefinierter Dateiname:
Zur Downloadseite:
Direkt herunterladen:
Alle JSON-Schnittstellen
export interface IGroupConfig {
Einige ID
id: number;
// Plugin-Name
name: string;
// Plugin-Icon
ico?: string;
// Plugin-Version
version?: string;
// Beschreibung des Plugins
description?: string;
// Standardpfad
reg: string;
// Vorfeldskript
prevJS: string;
// Plugin-Gruppierungsfunktion
groups: IRun[];
// Veröffentlichungsstatus
status?: string;
// Beispiele
examples?: string[];
}
export interface IRun {
// Funktionsfähigkeit
fn: string;
// Zusätzliche Referenzen
props: IRunProps;
}
export interface IIds {
// Parameter Ids
id: string;
// Parameter Pfad
attributes?: string[];
// Typ, möglicherweise Videotyp
type?: string;
// Bildbeschreibung
alt?: string;
Bildregeln ersetzen
replaceUrlRules?: IReplaceUrlRule[];
// Bildregeln filtern
filterUrlRules?: IReplaceUrlRule[];
}
export interface IReplaceUrlRule {
// Regeln ersetzen
pattern: string
// Regelmäßige Partielle / Volle Übereinstimmung
flags?: string
// Ersatzwert
replaceValue?: string
}
export interface IRunProps {
// Quellobjekt Standard ist document.querySelectorAll, gibt ein iterierbares Array zurück
source?: string;
// Parameter Ids
ids: IIds[];
// Gruppenname
groupName: string;
// Gruppenindex
groupIndex: number;
}
- Originaltext:https://mp.weixin.qq.com/s/tI2l8jbla4lczAJl7On27A
Veröffentlicht am 2024-12-10
广东
Jagd PicHound Browser Webseiten Bilder-Download-Editing-Management-Plugin-Tool
