As we all of know that today cross platform grow day by day. Most of the developers/Clients move towards Cross platform to save their time and money. Today we learn about how to integrate PayPal plug-in with Ionic framework.
Android Integration for android:-
I am assuming that you are familiar with ionic and successfully installed cordova in your System If not please follow this
Link:- http://ionicframework.com/docs/guide/installation.html
Create a new blank project (using CLI):-
A) Ionic Start Project Name Blank
B) Ionic Platform Add Android
C) Ionic Build Android
Step 1:- First install running this command cordova plugin add com.paypal.cordova.mobilesdk
Step2:-
Download https://github.com/paypal/PayPal-Cordova-Plugin
Copy paypal-mobile-js-helper and cdv-plugin-paypal-mobile-sdk js files from www folder and paste into your project js folder.
Step3:-
Add reference of these files into your index.js file
<script src=”paypal-mobile-js-helper.js”></script>
<script src=”cdv-plugin-paypal-mobile-sdk.js”></script>
Step4:-
Add payPalService.js file into your project from
https://gist.github.com/mssdineshsambial/f679ab69597c49b25f25
Step 5:-
Add lines into APP.js file
.constant(‘shopSettings’,{
payPalSandboxId :’Aar8HZzvc5NztVWodTBpOiOod9wWrBDrJUjyvRr4WsxcCD28xYig7oecfYsqxQUDu5QHptPpSALirxZD’,
payPalProductionId : ‘production id here’,
payPalEnv: ‘PayPalEnvironmentSandbox’, // for testing production for production
payPalShopName : ‘MyShopName’,
payPalMerchantPrivacyPolicyURL : ‘url to policy’,
payPalMerchantUserAgreementURL : ‘ url to user agreement ‘
})
Replace PayPalSandboxId and payPal Production Id with your send box Id and production client id
Step 6:-
Add these lines under you app controller button click to start paypal payment.
PaypalService.initPaymentUI().then(function () {
PaypalService.makePayment(90, “Total Amount”).then(function (response) {
alert(“success”+JSON.stringify(response));
}, function (error) {
alert(“Transaction Canceled”);
});
});
Gratitude...!!!!
