Paypal与Ionic框架的集成无法正常工作

Question

我开发了App。 在此，我整合了cordova-Paypal。 我添加了贝宝移动SDK。 但是它表明PayPalMobile没有在控制台中定义。我在js文件夹中复制了helper.js和sdk.js. 请帮我。

 var app=angular.module('starter.payPalService', []) app.factory('PaypalService', ['$q', '$ionicPlatform', 'shopSettings', '$filter', '$timeout', function ($q, $ionicPlatform, shopSettings, $filter, $timeout) { var init_defer; /** * Service object * @type object */ var service = { initPaymentUI: initPaymentUI, createPayment: createPayment, configuration: configuration, onPayPalMobileInit: onPayPalMobileInit, makePayment: makePayment }; /** * @ngdoc method * @name initPaymentUI * @methodOf app.PaypalService * @description * Inits the payapl ui with certain envs. * * * @returns {object} Promise paypal ui init done */ function initPaymentUI() { init_defer = $q.defer(); $ionicPlatform.ready().then(function () { var clientIDs = { "PayPalEnvironmentProduction": shopSettings.payPalProductionId, "PayPalEnvironmentSandbox": shopSettings.payPalSandboxId }; PayPalMobile.init(clientIDs, onPayPalMobileInit); }); return init_defer.promise; } /** * @ngdoc method * @name createPayment * @methodOf app.PaypalService * @param {string|number} total total sum. Pattern 12.23 * @param {string} name name of the item in paypal * @description * Creates a paypal payment object * * * @returns {object} PayPalPaymentObject */ function createPayment(total, name) { // "Sale == > immediate payment // "Auth" for payment authorization only, to be captured separately at a later time. // "Order" for taking an order, with authorization and capture to be done separately at a later time. var payment = new PayPalPayment("" + total, "EUR", "" + name, "Sale"); return payment; } /** * @ngdoc method * @name configuration * @methodOf app.PaypalService * @description * Helper to create a paypal configuration object * * * @returns {object} PayPal configuration */ function configuration() { // for more options see `paypal-mobile-js-helper.js` var config = new PayPalConfiguration({merchantName: shopSettings.payPalShopName, merchantPrivacyPolicyURL: shopSettings.payPalMerchantPrivacyPolicyURL, merchantUserAgreementURL: shopSettings.payPalMerchantUserAgreementURL}); return config; } function onPayPalMobileInit() { $ionicPlatform.ready().then(function () { // must be called // use PayPalEnvironmentNoNetwork mode to get look and feel of the flow PayPalMobile.prepareToRender(shopSettings.payPalEnv, configuration(), function () { $timeout(function () { init_defer.resolve(); }); }); }); } /** * @ngdoc method * @name makePayment * @methodOf app.PaypalService * @param {string|number} total total sum. Pattern 12.23 * @param {string} name name of the item in paypal * @description * Performs a paypal single payment * * * @returns {object} Promise gets resolved on successful payment, rejected on error */ function makePayment(total, name) { var defer = $q.defer(); total = $filter('number')(total, 2); $ionicPlatform.ready().then(function () { PayPalMobile.renderSinglePaymentUI(createPayment(total, name), function (result) { $timeout(function () { defer.resolve(result); }); }, function (error) { $timeout(function () { defer.reject(error); }); }); }); return defer.promise; } return service; }]); 

Controller.js：

 controller('MyCtrl' , function($scope,PaypalService){ $scope.click=function() { console.log("i am call"); // console.log(error); PaypalService.initPaymentUI().then(function () { console.log("i am call 2"); PaypalService.makePayment(1, "Total Amount").then(function (response) { alert("success"+JSON.stringify(response)); }, function (error) { alert('Transaction Canceled'); }); }); }; }) 

控制台错误：

 ReferenceError: PayPalMobile is not defined at payPalService.js:35 at processQueue (ionic.bundle.js:29132) at ionic.bundle.js:29148 at Scope.$eval (ionic.bundle.js:30400) at Scope.$digest (ionic.bundle.js:30216) at ChildScope.$apply (ionic.bundle.js:30508) at HTMLButtonElement.<anonymous> (ionic.bundle.js:65428) at defaultHandlerWrapper (ionic.bundle.js:16792) at HTMLButtonElement.eventHandler (ionic.bundle.js:16780) at triggerMouseEvent (ionic.bundle.js:2953) 

Answer 1

我在js文件夹中复制了helper.js和sdk.js

您不需要手动添加辅助JS。 插件将在/ js文件夹下自动创建这些文件。 您只需在导入cordova.js 之后输入以下语句。

您的index.html应该如下所示：

<!DOCTYPE html>
<html>
  <head>
  ...
    <script src="cordova.js"></script>
    <script src="js/paypal-mobile-js-helper.js"></script>
  ...
  </head>
  <body>
  ...
  </body>
</html>

还要确保您在Android模拟器或iOS模拟器上测试您的应用，或者更好的是，在真正的Android / iOS设备上进行测试。

参考： https : //github.com/paypal/PayPal-Cordova-Plugin#your-app-integration