Inhaltsverzeichnis
材料 
做法 
Heim WeChat-Applet Mini-Programmentwicklung WeChat-Applet-Parsing-H5-Dateimethode

WeChat-Applet-Parsing-H5-Dateimethode

May 01, 2017 am 11:02 AM

Zusammenfassung: Internetnutzer fragen oft, wie das WeChat-Applet H5-Dateien analysieren oder H5-Webseiten in die APP kapseln kann? Ich dachte zunächst, das sei unmöglich, denn die offizielle Antwort lautet: Jede Miniprogrammseite besteht aus vier verschiedenen Suffixdateien mit demselben Namen im selben Pfad, wie zum Beispiel: index.js, index.wxm...

Tabelle>
Internetnutzer fragen oft wie Lassen Sie das WeChat-Applet die H5-Datei analysieren oder die H5-Webseite in die APP kapseln? Ich dachte zunächst, das sei unmöglich, denn die offizielle Antwort lautet:
Jede Miniprogrammseite wird nach der gleichen Zusammensetzung erstellt von vier verschiedenen Suffixdateien mit demselben Namen unter dem Pfad, wie zum Beispiel: index.js, index.wxml, index.wxss, index.json. Dateien mit dem Suffix .js sind Skriptdateien, Dateien mit dem Suffix .json sind Konfigurationsdateien, Dateien mit dem Suffix .wxss sind Stylesheet-Dateien und Dateien mit dem Suffix .wxml sind Seitenstrukturdateien.

Die obige Bedeutung ist bereits sehr klar. Die Übersetzung lautet:
  • .js ist Javascript

    经常有网友问怎么让微信小程序解析H5文件或者类似封装H5网页到APP里面?我一开始觉得这是不可能的,因为官方的解答是这样的:

    每一个小程序页面是由同路径下同名的四个不同后缀文件的组成,如:index.js、index.wxml、index.wxss、index.json。.js后缀的文件是脚本文件,.json后缀的文件是配置文件,.wxss后缀的是样式表文件,.wxml后缀的文件是页面结构文件。

    上面的意思就已经很清楚了。翻译过来就是:
    • .js就是javascript

    • .wxss相当于css

    • .wxml相当于html

    然而,wxml与wxss的语法是微信自己定义,不同于html与css语法。既然语法都不一样,微信小程序自然无法加载H5页面。微信只能加载在工程内已经注册的page页面,无法打开外部链接,只能从服务器抓取数据

    前段时间,由于微信的编写文件不再是html格式,所以也无法解析 html代码,这个着实令人难过. 我在用网上的API接口获取数据时, 遇到了一个大坑, 那就是 API返回的数据竟然是 含有标签的字符串, 让我无从下手, 在尝试过正则失败后, 不断在网上看有没有可以解析的插件, 终于让我找到了, 那就是wxParse-微信小程序富文本解析组件, 它支持Html及markdown转wxml可视化, 下面不多说, 代码贡献上:

    API返回的数据:
    WeChat-Applet-Parsing-H5-Dateimethode

    注意:
    message 对应的 value 值 为

    [AppleScript] 

    1

    2

    "<h2 id="材料-nbsp">材料 </h2><hr>  \n<p>雪梨一个、冰糖适量、牙签几根</p>   <h2 id="做法-nbsp">做法 </h2><hr>  \n<p>1、雪梨洗好,用刀切去尾部,用勺子挖出梨核,最好挖干净,不然影响口感。 </p> \n<p>2、放几颗冰糖进去,插几根牙签,隔水蒸30分钟左右就OK了。</p>",

          "name": "冰糖雪梨"

    Nach dem Login kopieren


    这个小程序是无法解析的, 所以, 重点来了.
    wxParse-微信小程序富文本解析组件, 通过这个组件, 小程序就可以解析部分的 html文件 还包括 表情包哦, 下面是大礼包, 我将演示如何使用:

    • 下载官方demo

    • Copy文件夹wxParse,与 pages文件目录同级

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    //wxParse目录

    - wxParse/

      -wxParse.js(必须存在)

      -html2json.js(必须存在)

      -htmlparser.js(必须存在)

      -showdown.js(必须存在)

      -wxDiscode.js(必须存在)

      -wxParse.wxml(必须存在)

      -wxParse.wxss(必须存在)

      -emojis(可选)

    Nach dem Login kopieren

    3.引入必要文件

    3.1 在目标 wxml文件中添加以下代码

    1

    2

    3

    4

    <import src="../../wxParse/wxParse.wxml"/>

    <view class="wxParse">

        <template is="wxParse" data="{{wxParseData:article.nodes}}"/>

    </view>

    Nach dem Login kopieren

    3.2 在 wxss文件 中添加以下代码(可以是全局wxss,也可以是目标的 wxss文件)

    1

    @import "/wxParse/wxParse.wxss";

    Nach dem Login kopieren


    3.3 数据绑定(在目标的 js文件中添加)

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    //在 onLoad 函数里添加哦,

    var article = &#39;<p>我是HTML代码</p>&#39;;

    /**

    * WxParse.wxParse(bindName , type, data, target,imagePadding)

    * 1.bindName绑定的数据名(必填)

    * 2.type可以为html或者md(必填)

    * 3.data为传入的具体数据(必填)

    * 4.target为Page对象,一般为this(必填)

    * 5.imagePadding为当图片自适应是左右的单一padding(默认为0,可选)

    */

    var that = this;

    WxParse.wxParse(&#39;article&#39;, &#39;html&#39;, article, that,5);

    Nach dem Login kopieren

    4.你已成功,不信你看模拟器
    WeChat-Applet-Parsing-H5-Dateimethode



  • .wxss ist äquivalent zu CSS

  • .wxml ist äquivalent zu HTML

Die Syntax von WXML und WXSS wird jedoch von WeChat selbst definiert, was sich von der Syntax von HTML und CSS unterscheidet. Da die Syntax unterschiedlich ist, kann das WeChat-Applet die H5-Seite nicht laden. WeChat kann nur Seiten laden, die im Projekt registriert wurden, kann keine externen Links öffnen und kann nur Daten vom Server crawlen

Vor einiger ZeitWeil die von WeChat geschriebenen Dateien nicht mehr im HTML-Format, html, vorliegen Der Code kann nicht geparst werden. Das ist wirklich traurig. Als ich die Online-API-Schnittstelle zum Abrufen von Daten verwendete, stieß ich auf eine große Gefahr, das heißt, die von der API zurückgegebenen Daten waren eine Zeichenfolge, die Beschriftungen enthielt, was mich unfähig machte Nachdem ich reguläre Ausdrücke ausprobiert hatte und fehlschlug, suchte ich online nach Plugins, die analysieren können, und schließlich fand ich es, nämlich das wxParse-WeChat-Applet Rich-Text-Parsing-Komponente, sie unterstützt die HTML- und Markdown-Konvertierung in die WXML-Visualisierung. Unten gibt es nicht viel zu sagen, Codebeitrag:

Von der API zurückgegebene Daten:
WeChat-Applet-Parsing-H5-Dateimethode

Hinweis:
Der der Nachricht entsprechende Wert ist
[AppleScript]

Dieses Applet kann nicht analysiert werden, daher hier der entscheidende Punkt.
wxParse-WeChat-Applet-Rich-Text-Analysekomponente. Über diese Komponente kann das Applet einige HTML-Dateien einschließlich Emoticons analysieren. Das Folgende ist ein großes Geschenkpaket, ich werde die Verwendung demonstrieren:

  • Laden Sie die offizielle Demo herunter
  • Kopieren Der Ordner wxParse befindet sich auf der gleichen Ebene wie das Seitendateiverzeichnis

3. Notwendige Dateien einführen

3.1 Fügen Sie den folgenden Code in die Ziel-WXML-Datei ein

3.2 Fügen Sie den folgenden Code in die WXSS-Datei ein (kann die globale WXSS- oder die Ziel-WXSS-Datei sein)

3.3 Datenbindung (in der Ziel-JS-Datei hinzugefügt)

4 Sie haben es geschafft Glauben Sie mir nicht, schauen Sie sich den Simulator an
WeChat-Applet-Parsing-H5-Dateimethode


Das obige ist der detaillierte Inhalt vonWeChat-Applet-Parsing-H5-Dateimethode. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
2 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Abenteuer: Wie man riesige Samen bekommt
1 Monate vor By 尊渡假赌尊渡假赌尊渡假赌
Zwei -Punkte -Museum: Alle Exponate und wo man sie finden kann
1 Monate vor By 尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Es gibt Gerüchte, dass „das iPhone 16 WeChat möglicherweise nicht unterstützt', und Apples technischer Berater in China sagte, dass man mit Tencent über App-Store-Provisionen kommuniziert Es gibt Gerüchte, dass „das iPhone 16 WeChat möglicherweise nicht unterstützt', und Apples technischer Berater in China sagte, dass man mit Tencent über App-Store-Provisionen kommuniziert Sep 02, 2024 pm 10:45 PM

Vielen Dank an die Internetnutzer Qing Qiechensi, HH_KK, Satomi Ishihara und Wu Yanzu aus Südchina für die Übermittlung von Hinweisen! Laut Nachrichten vom 2. September gibt es aktuelle Gerüchte, dass „das iPhone 16 WeChat möglicherweise nicht unterstützt.“ Als Reaktion darauf antwortete ein Reporter von Shell Finance bei Apples offizieller Hotline, ob iOS-Systeme oder Apple-Geräte weiterhin unterstützt werden könnten Verwenden Sie WeChat und WeChat. Die Frage, ob es weiterhin im Apple App Store gelistet und heruntergeladen werden kann, erfordert eine Kommunikation und Diskussion zwischen Apple und Tencent, um die zukünftige Situation zu bestimmen. Software App Store und WeChat Problembeschreibung Der technische Berater des Software App Store wies darauf hin, dass Entwickler möglicherweise Gebühren zahlen müssen, um Software im Apple Store bereitzustellen. Ab einer bestimmten Anzahl an Downloads muss Apple für weitere Downloads entsprechende Gebühren zahlen. Apple kommuniziert aktiv mit Tencent,

Deepseek Image Generation Tutorial Deepseek Image Generation Tutorial Feb 19, 2025 pm 04:15 PM

Deepseek: Ein leistungsstarkes Werkzeug für KI -Bildgenerierung! Deepseek selbst ist kein Werkzeug zur Bildgenerierung, aber seine leistungsstarke Kerntechnologie unterstützt viele KI -Malwerkzeuge. Möchten Sie wissen, wie Sie Deepseek verwenden, um Bilder indirekt zu generieren? Bitte lesen Sie weiter! Generieren Sie Bilder mit Deepseek-basierten KI-Tools: In den folgenden Schritten werden die folgenden Tools verwendet. Wählen Sie den Zeichnungsmodus aus: Wählen Sie "AI -Zeichnung" oder eine ähnliche Funktion aus und wählen Sie den Bildtyp entsprechend Ihren Anforderungen wie "Anime Avatar", "Landschaft" aus, "Landschaft".

Mit der Angelegenheit vertraute Personen antworteten, dass „WeChat das Apple iPhone 16 möglicherweise nicht unterstützt': Gerüchte sind Gerüchte Mit der Angelegenheit vertraute Personen antworteten, dass „WeChat das Apple iPhone 16 möglicherweise nicht unterstützt': Gerüchte sind Gerüchte Sep 02, 2024 pm 10:43 PM

Gerüchte, dass WeChat das iPhone 16 unterstützt, wurden entlarvt. Vielen Dank an die Internetnutzer Xi Chuang Jiu Shi und HH_KK für die Übermittlung von Hinweisen! Laut Nachrichten vom 2. September gibt es heute Gerüchte, dass WeChat das iPhone 16 möglicherweise nicht unterstützt. Sobald das iPhone auf das iOS 18.2-System aktualisiert wird, kann es WeChat nicht mehr verwenden. Laut „Daily Economic News“ erfuhren mit der Angelegenheit vertraute Personen, dass es sich bei diesem Gerücht um ein Gerücht handelt. Antwort von Apple: Laut Shell Finance antwortete der technische Berater von Apple in China, dass die Frage, ob WeChat weiterhin auf iOS-Systemen oder Apple-Geräten genutzt werden könne und ob WeChat weiterhin im Apple App Store gelistet und heruntergeladen werden dürfe, geklärt werden müsse Nur durch Kommunikation und Diskussion können wir die zukünftige Situation bestimmen. Derzeit kommuniziert Apple aktiv mit Tencent, um zu bestätigen, ob Tencent dies auch weiterhin tun wird

So erhalten Sie Geld per WeChat-Überweisung zurück So erhalten Sie Geld per WeChat-Überweisung zurück May 08, 2024 pm 01:18 PM

1. Öffnen Sie die WeChat-App, suchen Sie die Übertragungsnachricht, die zurückgegeben werden muss, und klicken Sie zur Eingabe. 2. Suchen Sie in der Benutzeroberfläche mit den Übertragungsdetails nach der Option [Zurück] und klicken Sie darauf. 3. Klicken Sie im Popup-Fenster auf die Schaltfläche [Zurückgeben], um das überwiesene Geld zurückzuerstatten.

Gateio Chinesische offizielle Website Gate.io Trading Platform Website Gateio Chinesische offizielle Website Gate.io Trading Platform Website Feb 21, 2025 pm 03:06 PM

Gate.io, eine 2013 gegründete führende Kryptowährungs -Handelsplattform, bietet chinesischen Nutzern eine vollständige offizielle chinesische Website. Die Website bietet eine breite Palette von Dienstleistungen, darunter Spot -Handel, Futures -Handel und -kredite, und bietet besondere Funktionen wie chinesische Schnittstelle, reichhaltige Ressourcen und Community -Unterstützung.

Gateio Exchange App Old Version Gateio Exchange App Old Version Download Kanal Gateio Exchange App Old Version Gateio Exchange App Old Version Download Kanal Mar 04, 2025 pm 11:36 PM

Gateio Exchange-App-Kanäle für alte Versionen, die offizielle Anwendungsmärkte von Drittanbietern, Forum-Communities und andere Kanäle abdecken.

Ouyi Exchange App Inländische Download -Tutorial Ouyi Exchange App Inländische Download -Tutorial Mar 21, 2025 pm 05:42 PM

Dieser Artikel enthält einen detaillierten Leitfaden zum sicheren Download der Ouyi OKX -App in China. Aufgrund von Einschränkungen in den inländischen App -Stores wird den Benutzern empfohlen, die App über die offizielle Website von Ouyi OKX herunterzuladen oder den von der offiziellen Website bereitgestellten QR -Code zum Scannen und Herunterladen zu verwenden. Überprüfen Sie während des Download-Prozesses unbedingt die offizielle Website-Adresse, überprüfen Sie die Anwendungsberechtigungen, führen Sie nach der Installation einen Sicherheitsscan durch und aktivieren Sie die Zwei-Faktor-Überprüfung. Bleiben Sie während der Nutzung an lokale Gesetze und Vorschriften ein, verwenden Sie ein sicheres Netzwerkumfeld, schützen Sie die Sicherheit der Kontos, wachsam gegen Betrug und investieren rational. Dieser Artikel ist nur als Referenz und stellt keine Anlageberatung dar.

Sesam Open Door Login Registrierung Eingangstor Sesam Open Door Login Registrierung Eingangstor Mar 04, 2025 pm 04:51 PM

Gate.io (Sesam Open Door) ist die weltweit führende Kryptowährungsprüfung. Das Tutorial umfasst Schritte wie Kontoregistrierung und Anmeldung, KYC -Zertifizierung, Fiat -Währung und digitale Währungsaufladung, Handelspaarauswahl, Grenz-/Markttransaktionsbestellungen sowie Bestellungen und Transaktionsaufzeichnungen, wodurch Sie schnell auf der Gate.IO -Plattform für den Kryptowährungshandel beginnen. Egal, ob ein Anfänger oder ein Veteran, Sie können von diesem Tutorial profitieren und die Handelsfähigkeiten von Gate.io problemlos beherrschen.

See all articles