Heim > Web-Frontend > uni-app > Lassen Sie uns darüber sprechen, wie Sie den Browser öffnen und zur URL in UniApp springen

Lassen Sie uns darüber sprechen, wie Sie den Browser öffnen und zur URL in UniApp springen

PHPz
Freigeben: 2023-04-17 11:17:33
Original
7952 Leute haben es durchsucht

Im Bereich der Entwicklung mobiler Anwendungen ist es häufig erforderlich, einen externen Browser in der Anwendung zu öffnen und zur angegebenen URL zu springen. Entwickler, die UniApp zum Entwickeln verwenden, müssen sich häufig mit ähnlichen Anforderungen auseinandersetzen. In diesem Artikel stellen wir Ihnen vor, wie Sie den Browser öffnen und zur URL in UniApp springen.

1. Verwenden Sie das native Plug-in, um zur URL zu springen.

In UniApp können wir das native Plug-in verwenden, um die Funktion zum Öffnen des Browsers und zum Springen zur URL zu realisieren. Viele häufig verwendete native Plug-Ins sind in das UniApp-Framework integriert, z. B. zum Tätigen von Anrufen, zum Senden von Textnachrichten, zum Abrufen des geografischen Standorts usw. Zu diesen Plug-ins zählen auch Plug-ins zum Öffnen von Browsern.

Wir können das Plug-in verwenden, das den Browser öffnet, indem wir die Methode uni.navigateTo({ url: 'plugin://NativePlugin/webview?url=http://www.uniapp.com' }) aufrufen. Unter diesen gibt der URL-Parameter die URL-Adresse an, die übersprungen werden muss. Wenn wir beispielsweise zur Startseite der offiziellen UniApp-Website (http://www.uniapp.com) springen möchten, können wir den folgenden Code verwenden:

uni.navigateTo({ url: 'plugin://NativePlugin /webview?url =http://www.uniapp.com' })

Nach dem Aufruf dieser Methode können Sie einen externen Browser in der Anwendung öffnen und zur angegebenen URL-Adresse springen.

2. Verwenden Sie die H5-Seite zum Öffnen der URL

Zusätzlich zur Verwendung nativer Plug-Ins können wir in UniApp auch die H5-Seite zum Öffnen der URL verwenden. Die Methode zum Öffnen einer URL mit einer H5-Seite ähnelt dem nativen Plug-in. Sie müssen lediglich uni.navigateTo({ url: '/pages/webview/webview?url=http://www.uniapp aufrufen .com'}), um dies zu erreichen.

Es ist zu beachten, dass wir eine neue Webview-Seite im Seitenverzeichnis des Projekts erstellen und das Tag verwenden müssen auf dieser Seite. Öffnen Sie die URL.

Auf der Webview-Seite müssen wir die URL-Adresse erhalten, die geöffnet werden muss, indem wir Parameter übergeben. Definieren Sie beispielsweise eine URL-Variable in Daten und erhalten Sie die vom Parameter übergebene URL-Adresse über die Funktion onLoad:

export default {
data () {

return {
  url: ''
}
Nach dem Login kopieren

},
onLoad (options) {

this.url = options.url
Nach dem Login kopieren

}
}

wobei Optionen Parameter sind, die durch Übergabe von Parametern erhalten werden.

3. Externe Links verwenden

Zusätzlich zu den beiden oben genannten Methoden können wir auch externe Links verwenden, um URLs zu öffnen. Diese Methode ähnelt der Verwendung einer H5-Seite zum Öffnen einer URL. Sie müssen lediglich Tags in der Anwendung verwenden, um die URL-Adressen zu verknüpfen.

Es ist zu beachten, dass, wenn die Anwendung eine URL über das a-Tag öffnet, während die Anwendung ausgeführt wird, relevante Konfigurationen zur manifest.json-Datei der Anwendung hinzugefügt werden müssen, um zu verhindern, dass die Anwendung vom System abgefangen oder deaktiviert wird.

Das Folgende ist ein Codebeispiel, das zur Datei manifest.json hinzugefügt wurde:

{
"app": {

"name": "UniApp",
"versionName": "1.0.0",
"versionCode": 1,
"description": "This is a demo application",
"minSdkVersion": "1050",
"custom": {
  "app-plus": {
    "launchWebviewPlus": {
      "url": {
        "patterns": [
          "http://www.uniapp.com",
          "https://www.uniapp.com"
        ],
        "schemes": [
          "http",
          "https"
        ]
      }
    }
  }
}
Nach dem Login kopieren

}
}

Im Manifest-Konfigurationselement müssen wir die erforderliche URL-Adresse hinzufügen Öffnen Sie das Array „Muster“, fügen Sie das URL-Protokoll zum Array „Schemas“ hinzu und fügen Sie das Konfigurationselement zum Attribut „launchWebviewPlus“ unter „app-plus“ in „Benutzerdefiniert“ hinzu.

4. Zusammenfassung

Durch die oben genannten drei Methoden können wir die Funktion des Öffnens des Browsers und des Springens zur URL in der UniApp-Anwendung realisieren. Erstens können wir native Plug-Ins verwenden, um es zu implementieren, und zweitens können wir es über H5-Seiten implementieren. Schließlich können wir hierfür auch externe Links nutzen.

Es ist zu beachten, dass Sie bei der Verwendung der oben genannten Methoden entsprechend den tatsächlichen Bedürfnissen auswählen müssen, um die beste Wirkung zu erzielen. Gleichzeitig müssen wir auch die relevanten Spezifikationen befolgen, um zu verhindern, dass Anwendungen vom System abgefangen oder deaktiviert werden, um sicherzustellen, dass Anwendungen normal ausgeführt werden können.

Das obige ist der detaillierte Inhalt vonLassen Sie uns darüber sprechen, wie Sie den Browser öffnen und zur URL in UniApp springen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage