Inhaltsverzeichnis
Gemeinsame Funktionen auf dem Markt
Lösungs-URL-Schema
Verwenden Sie lieber iframe
Heim Web-Frontend H5-Tutorial Versuchen Sie, den APP-Instanzcode auf der H5-Seite aufzurufen

Versuchen Sie, den APP-Instanzcode auf der H5-Seite aufzurufen

Feb 11, 2018 am 11:18 AM
html5 代码 实例

In diesem Artikel wird hauptsächlich der Beispielcode für den Aufruf der APP auf der H5-Seite vorgestellt. Ich hoffe, er kann Ihnen helfen.

Gemeinsame Funktionen auf dem Markt

Diese Art von Funktion sollte heutzutage sehr verbreitet sein, Taobao H5, Zhihu H5 und so weiter. . .

Versuchen Sie, den APP-Instanzcode auf der H5-Seite aufzurufen Versuchen Sie, den APP-Instanzcode auf der H5-Seite aufzurufen

Wenn Sie darauf klicken, wird die APP gestartet oder die Download-Seite geöffnet oder direkt heruntergeladen.

Aber ich habe festgestellt, dass diese Funktion von Zhihu etwas anders ist

Ihre Logik besteht darin, mich zuerst zu fragen, ob ich die Zhihu-APP auf meinem Telefon öffnen soll (der Browsermechanismus fragt den Benutzer um Erlaubnis ). Dann erscheint erneut die Download-Eingabeaufforderung.

Versuchen Sie, den APP-Instanzcode auf der H5-Seite aufzurufen Versuchen Sie, den APP-Instanzcode auf der H5-Seite aufzurufen

Lösungs-URL-Schema

URL-Schema wird sowohl auf IOS als auch auf Android unterstützt und ist gut kompatibel.

Verwenden Sie lieber iframe

Der Pseudocode lautet wie folgt:

const iframe = document.createElement('iframe');iframe.src = 'URL scheme'; // URL scheme的方式跳转iframe.style.display = 'none';document.body.appendChild(iframe);
Nach dem Login kopieren

Wenn alle Umgebungen ihn zu diesem Zeitpunkt unterstützen, wird er aktiviert up APP.

Aber dies ist eine ideale Situation, mehr ist die schnelle Logik der Kompatibilitätsverarbeitung.

Einige Systeme fangen den src von iframe ab (dies ist nur einer der Gründe dafür, dass die APP nicht aktiviert werden kann), da es sich bei diesem src-Attribut um einen illegalen Hacker handelt und durch dessen Ausnutzung viele Schwachstellen entstehen.

Zu diesem Zeitpunkt ist es daher notwendig, festzustellen, ob die Anpassung der APP fehlgeschlagen ist.

Der Pseudocode lautet wie folgt:

const timer = 1000;setTimeout(function() {        // 执行成功后移除iframedocument.body.removeChild(iframe);//setTimeout小于2000通常认为是唤起APP失败 if (Date.now() - last 
Nach dem Login kopieren

Verstehen :

  • Wenn der Evokation ist erfolgreich, H5 Die Seite wird in den Hintergrund geschaltet und der Timer wird verzögert. Auch wenn der Benutzer von der App zur H5-Seite wechselt, muss der Zeitunterschied größer als 2S sein.

  • Wenn die Erregung fehlschlägt, wird der Timer pünktlich ausgeführt (auch wenn eine Verzögerung von 100 ms vorhanden ist, reicht das aus) und muss zu diesem Zeitpunkt weniger als 2 Sekunden betragen.

Wenn der Iframe abgefangen wird, können wir aus Kompatibilitätsgründen window.location.href = URL scheme verwenden.

Verwandte Empfehlungen:

10 empfohlene Artikel über H5-Seiten

Detaillierte Erläuterung des Prozesses zum Erstellen einer WeChat H5-Seite

Hinweise zu H5-Seiten

Das obige ist der detaillierte Inhalt vonVersuchen Sie, den APP-Instanzcode auf der H5-Seite aufzurufen. 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

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

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)

Tabellenrahmen in HTML Tabellenrahmen in HTML Sep 04, 2024 pm 04:49 PM

Anleitung zum Tabellenrahmen in HTML. Hier besprechen wir verschiedene Möglichkeiten zum Definieren von Tabellenrändern anhand von Beispielen für den Tabellenrand in HTML.

Verschachtelte Tabelle in HTML Verschachtelte Tabelle in HTML Sep 04, 2024 pm 04:49 PM

Dies ist eine Anleitung für verschachtelte Tabellen in HTML. Hier diskutieren wir anhand der entsprechenden Beispiele, wie man eine Tabelle innerhalb der Tabelle erstellt.

HTML-Rand links HTML-Rand links Sep 04, 2024 pm 04:48 PM

Anleitung zum HTML-Rand links. Hier besprechen wir einen kurzen Überblick über HTML margin-left und seine Beispiele sowie seine Code-Implementierung.

HTML-Tabellenlayout HTML-Tabellenlayout Sep 04, 2024 pm 04:54 PM

Leitfaden zum HTML-Tabellenlayout. Hier besprechen wir die Werte des HTML-Tabellenlayouts zusammen mit den Beispielen und Ausgaben im Detail.

HTML-Eingabeplatzhalter HTML-Eingabeplatzhalter Sep 04, 2024 pm 04:54 PM

Leitfaden für HTML-Eingabeplatzhalter. Hier besprechen wir die Beispiele für HTML-Eingabeplatzhalter zusammen mit den Codes und Ausgaben.

Text in HTML verschieben Text in HTML verschieben Sep 04, 2024 pm 04:45 PM

Anleitung zum Verschieben von Text in HTML. Hier besprechen wir eine Einführung, wie Marquee-Tags funktionieren, mit Syntax und Beispielen für die Implementierung.

HTML-geordnete Liste HTML-geordnete Liste Sep 04, 2024 pm 04:43 PM

Leitfaden zur HTML-geordneten Liste. Hier besprechen wir auch die Einführung von HTML-geordneten Listen und Typen sowie deren Beispiele

HTML-Onclick-Button HTML-Onclick-Button Sep 04, 2024 pm 04:49 PM

Anleitung zum HTML-OnClick-Button. Hier diskutieren wir deren Einführung, Funktionsweise, Beispiele und Onclick-Events in verschiedenen Veranstaltungen.

See all articles