So ermitteln Sie, ob der Code nur in der App in uniapp ausgeführt wird

Mit der rasanten Entwicklung mobiler Anwendungen werden plattformübergreifende Entwicklungsframeworks bei Entwicklern immer beliebter. Uniapp hat als plattformübergreifendes Entwicklungsframework, das auf dem Vue.js-Framework basiert, auf dem aktuellen Markt große Aufmerksamkeit erregt. In Uniapp müssen wir jedoch manchmal feststellen, ob der Code im Webbrowser oder in der App ausgeführt wird. In diesem Artikel erfahren Sie, wie Sie feststellen können, ob der Code nur in der App in Uniapp ausgeführt wird.

Die erste Methode: Verwenden Sie die Navigationsleiste zum Ein- und Ausblenden.

Die Navigationsleiste in Uniapp ist in zwei Methoden unterteilt, nämlich die App-Navigationsleiste und die Web-Navigationsleiste. In Projekten können wir diese Funktion nutzen, um Urteile zu fällen.

Der Code ist wie folgt implementiert:

uni.onNavigationBarChange((res) => {
  if (res.type === 'show') {
    console.log('在App中运行')
  } else {
    console.log('在Web浏览器中运行')
  }
})

Auf der App-Seite wird die Navigationsleiste standardmäßig angezeigt. Wenn die Navigationsleiste angezeigt wird, führt der Code also die Anweisung Run in App aus. Beim Zugriff in einem Webbrowser ist die Navigationsleiste standardmäßig ausgeblendet. Führen Sie die Anweisung Im Webbrowser ausführen aus. Hinweis: Für diese Methode muss die Navigationsleiste auf der Seite aktiviert sein. 在App中运行的语句。当在Web浏览器中访问时，导航栏默认是隐藏的，执行在Web浏览器中运行语句。注意：此方法需要在页面内启用导航栏。

第二种方法：利用uni.getSystemInfoSync

uni.getSystemInfoSync方法可以获取设备信息，通过获取设备信息中的platform属性来判断。

代码实现如下：

const systemInfo = uni.getSystemInfoSync()
if (systemInfo.platform === 'android' || systemInfo.platform === 'ios') {
  console.log('在App中运行')
} else {
  console.log('在Web浏览器中运行')
}

在App中运行时，platform属性返回的是android或者ios，所以执行在App中运行的语句，当在Web浏览器中访问时，返回的是h5，执行在Web浏览器中运行语句。

第三种方法：利用uni.postMessage与onmessage

通过向自己页面发送消息，然后在onmessage中获取消息，通过判断消息来源来确定代码在App或者Web端运行。

代码实现如下：

// 发送消息
uni.postMessage({ from: 'uniapp' })

// 监听消息
window.onmessage = (event) => {
  if (event.data.from === 'uniapp') {
    console.log('在App中运行')
  } else {
    console.log('在Web浏览器中运行')
  }
}

在App中运行时，postMessage发送的消息来源为uniapp，所以执行在App中运行的语句，当在Web浏览器中访问时，由于没有调用postMessage

Zweite Methode: Verwenden Sie die Methode uni.getSystemInfoSync

uni.getSystemInfoSync, um Geräteinformationen abzurufen, die durch den Abruf des Attributs platform in den Geräteinformationen ermittelt werden können.

Der Code ist wie folgt implementiert:

rrreee

Bei der Ausführung in der App gibt das platform-Attribut android oder ios zurück, also führen Sie Die Anweisung „Run in App“ gibt h5 zurück, wenn in einem Webbrowser darauf zugegriffen wird. Führen Sie die Anweisung „Run in App“ aus. 🎜🎜Die dritte Methode: Verwenden Sie uni.postMessage und onmessage🎜🎜, um eine Nachricht an Ihre eigene Seite zu senden, und erhalten Sie die Nachricht dann in onmessage, Bestimmen Sie, ob der Code auf der App- oder Web-Seite ausgeführt wird, indem Sie die Quelle der Nachricht ermitteln. 🎜🎜Der Code ist wie folgt implementiert: 🎜rrreee🎜Bei der Ausführung in der App ist die Quelle der von postMessage gesendeten Nachricht uniapp, also führen Sie Run in App aus -Anweisung: Beim Zugriff in einem Webbrowser wird keine Anweisung ausgeführt, da die Methode postMessage nicht aufgerufen wird. 🎜🎜Zusammenfassung: 🎜🎜Durch die oben genannten drei Methoden können wir genauer bestimmen, ob der Code nur in der App ausgeführt wird. In der tatsächlichen Entwicklung kann die geeignete Methode entsprechend den Projektanforderungen ausgewählt werden. Es ist zu beachten, dass bei Verwendung der ersten Methode die Navigationsleiste auf der Seite aktiviert werden muss. 🎜🎜Uniapp verfügt über viele leistungsstarke Funktionen und Features, was einer der Gründe ist, warum es in der plattformübergreifenden Entwicklung beliebt ist. Ich hoffe, dieser Artikel kann Uniapp-Entwicklern helfen. 🎜

Das obige ist der detaillierte Inhalt vonSo ermitteln Sie, ob der Code nur in der App in uniapp ausgeführt wird. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!