Maison > Article > interface Web > Comment utiliser Alipay pour payer avec uniapp
Ces dernières années, le paiement mobile est devenu l'une des méthodes de transaction les plus pratiques, les plus rapides et les plus sûres. En tant que plateforme de paiement mobile la plus utilisée en Chine, Alipay est très appréciée des utilisateurs. Avec la popularité d'uniapp (un framework de développement multiplateforme basé sur Vue.js), de nombreux développeurs souhaitent également intégrer les fonctions de paiement Alipay dans uniapp. Cet article donnera une brève introduction sur la façon d'utiliser Alipay pour payer avec uniapp.
1. Inscription sur la plateforme ouverte Alipay
Avant d'utiliser Alipay pour payer, les développeurs doivent d'abord s'inscrire sur la plateforme ouverte Alipay. Après avoir accédé à la plateforme ouverte Alipay (https://opendocs.alipay.com/open), sélectionnez « Inscription à la plateforme ouverte » et remplissez les informations pertinentes pour finaliser l'inscription.
2. Intégrez le SDK Alipay
Après une inscription réussie, les développeurs doivent télécharger le SDK Alipay et l'intégrer dans le projet. Vous pouvez accéder rapidement au SDK Alipay via l'outil uni-app-plus fourni sur le site officiel d'uniapp. Le processus d'utilisation d'uni-app-plus est le suivant :
1. Installez uni-app-plus
npm install -g uni-app-plus
2 Utilisez uni-app-plus pour créer un projet uni-app
uni-app-plus init myApp
3. et ajoutez le plug-in Alipay
cd myApp uni-app-plus plugin add ali-pay
4. Après avoir ajouté le plug-in, une référence au plug-in Alipay sera automatiquement ajoutée dans manifest.json :
"plugins": { "ali-pay": { "version": "1.4.4", "provider": "com.baidu.capacitor.alipay.AliPaySdkPlugin" } }, "compilerOptions": { ... "provider": { "ali-pay": { "alias": "ap" } } }
5. Utilisez l'outil HBuilderX intégré à uni-app. -plus pour le développement.
Parmi eux, le SDK Alipay doit être téléchargé depuis le centre de développement de la plateforme ouverte Alipay. Après le téléchargement, décompressez-le pour obtenir le dossier "AlipaySDK.framework" et les trois en-têtes "APAuthV2Info.h", "APOrderInfo.h". " et le fichier "APOrderService.h", faites-le glisser dans le dossier "Destination" pour terminer l'ajout du SDK.
3. Configurer les informations de paiement Alipay
Après avoir terminé l'intégration du SDK Alipay, les développeurs doivent configurer les informations de paiement Alipay. Le processus spécifique est le suivant :
1. Créez une application sur la plateforme ouverte Alipay et obtenez l'APP_ID, le PID, la PRIVATE_KEY et d'autres informations de l'application.
2. Pendant l'utilisation, configurez l'APPID, le PARTNERID, la clé privée du commerçant, la clé publique Alipay et d'autres informations dans le projet. Exemple :
const ap = uni.requireNativePlugin('ali-pay') // 引入支付宝插件 const privateKey = `-----BEGIN RSA PRIVATE KEY----- *****此处为商户私钥***** -----END RSA PRIVATE KEY-----` const aliPublicKey = `*****此处为支付宝公钥*****` const orderInfo = { // 订单信息 body: '测试商品', subject: '测试商品', out_trade_no: '1544665957487', // 订单号 timeout_express: '30m', total_amount: '0.01' }
4. Implémentation du paiement Alipay
Après avoir terminé l'intégration du SDK Alipay et la configuration des informations de paiement Alipay, vous pouvez commencer à utiliser uniapp pour implémenter la fonction de paiement Alipay.
1. Initier le paiement Alipay
Utilisez la pay()
méthode du plug-in Alipay pour lancer une demande de paiement à Alipay :
ap.pay({ orderInfo: orderInfo, // 订单信息 privateKey: privateKey, // 商户私钥 aliPublicKey: aliPublicKey // 支付宝公钥 }, function(retJson) { console.log(JSON.stringify(retJson)) })
2. Rappel du résultat du paiement Alipay
Une fois le paiement Alipay effectué, le résultat du paiement peut être obtenu. via la méthode de rappel d'Alipay :
document.addEventListener('AlipayPayResult', function (res) { // res.detail.code ==> 9000支付成功 6001取消支付 4000支付失败 ... })
À ce stade, nous avons implémenté avec succès la fonction de paiement en utilisant Alipay dans uniapp. D'une manière générale, seule une petite quantité de configuration et d'écriture de code est requise pour compléter cette fonction, ce qui apporte une grande commodité aux développeurs.
À l'avenir, la demande de paiements mobiles sera de plus en plus élevée. En tant que cadre de développement multiplateforme, l'intégration d'uniapp avec le SDK Alipay aura une valeur applicative extrêmement élevée.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!