Anleitung zum Zugriff und zur Nutzung der Bezahlfunktion von UniApp

Anleitung für den Zugriff und die Nutzung der Zahlungsfunktion von UniApp

Angesichts der Popularität des mobilen Bezahlens müssen viele Anwendungen Zahlungsfunktionen integrieren, um Benutzern die Durchführung von Online-Zahlungen zu erleichtern. Als plattformübergreifendes Entwicklungsframework auf Basis von Vue.js verfügt UniApp über die Merkmale einer einmaligen Entwicklung und plattformübergreifenden Nutzung und kann den Zugriff auf Zahlungsfunktionen problemlos implementieren. In diesem Artikel wird der Zugriff auf die Zahlungsfunktion in UniApp vorgestellt und Codebeispiele gegeben.

1. Zugriff auf die Zahlungsfunktion

1. Fügen Sie Zahlungsberechtigungen in der Datei manifest.json auf der App-Seite hinzu:

"permissions": {
  "payment": {
    "description": "用于进行支付操作"
  }
}

2. Fügen Sie Zahlungsberechtigungen in der Datei manifest.json auf der H5-Seite hinzu:

"permissions": {
  "payment": {
    "description": "用于进行支付操作"
  }
}

3. Fügen Sie im Miniprogramm das Zahlungsmodul zur Datei import.js der nativen Komponente hinzu:

export default {
  payment: {
    module: 'wx',
    provider: 'wxpay'
  }
}

4. Führen Sie auf der Zahlungsseite das uni.paid-Objekt ein:

import uni from 'uni-modules'

export default {
  methods: {
    pay() {
      uni.payment.requestPayment({
        provider: 'wxpay',
        orderInfo: {...}, // 支付订单信息
        success: res => {
          console.log('支付成功', res)
        },
        fail: err => {
          console.log('支付失败', err)
        }
      })
    }
  }
}

2. Anweisungen zur Verwendung der Zahlungsfunktion

1. Erhalten Informationen zum Zahlungsauftrag

Bevor Sie eine Zahlung vornehmen, müssen Sie relevante Informationen zum Zahlungsauftrag einholen. Zu diesen Informationen gehören in der Regel Bestellnummer, Zahlungsbetrag, Produktbeschreibung usw. Diese Informationen können durch Aufruf der serverseitigen Schnittstelle abgerufen und dann an die Zahlungsseite übergeben werden.

2. Initiieren Sie eine Zahlungsanforderung

Auf der Zahlungsseite rufen Sie die Zahlungsmethode uni.paid.requestPayment auf und übergeben dabei die Zahlungsauftragsinformationen und die Rückruffunktion, wenn die Zahlung erfolgreich ist und fehlschlägt. Diese Methode öffnet die Zahlungsschnittstelle und wartet darauf, dass der Benutzer das Zahlungskennwort eingibt oder die Zahlung bestätigt.

3. Zahlungsergebnisse verarbeiten

Nach erfolgreicher Zahlung wird die Erfolgsrückruffunktion ausgelöst, in der die Logik nach erfolgreicher Zahlung verarbeitet werden kann, z. B. Aktualisierung des Bestellstatus, Springen zur Zahlungserfolgsseite, usw.

Wenn die Zahlung fehlschlägt, wird die Fehlerrückruffunktion ausgelöst. Die Logik nach dem Zahlungsfehler kann in dieser Funktion verarbeitet werden, z. B. den Benutzer darüber informieren, dass die Zahlung fehlgeschlagen ist, zur Zahlungsfehlerseite springen usw.

3. Codebeispiele

Das folgende Beispiel ist der Code für die WeChat-Zahlung auf der Zahlungsseite:

<script>
import uni from 'uni-modules'

export default {
  methods: {
    pay() {
      uni.payment.requestPayment({
        provider: 'wxpay',
        orderInfo: {...}, // 支付订单信息
        success: res =&gt; {
          console.log('支付成功', res)
        },
        fail: err =&gt; {
          console.log('支付失败', err)
        }
      })
    }
  }
}
</script>

4. Dieser Artikel stellt die Schritte zum Zugriff auf die Zahlungsfunktion in UniApp vor und gibt Codebeispiele. Durch die oben genannten Schritte können Entwickler die Zahlungsfunktion einfach implementieren und den Stil und die Zahlungslogik der Zahlungsseite an ihre eigenen Bedürfnisse anpassen. Ich hoffe, dieser Artikel hilft Ihnen beim Zugriff auf die Zahlungsfunktion in UniApp.

Das obige ist der detaillierte Inhalt vonAnleitung zum Zugriff und zur Nutzung der Bezahlfunktion von UniApp. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!