Я только что написал blog article об этом со всеми необходимыми деталями.
Вот простой способ использования angularJS для интеграции Stripe Checkout на вашу веб-страницу.
Во-первых, в вашем HTML добавить ссылку нашивки скрипт внутри головки тега:
<head>
[angularJS includes here]
<script type="text/javascript" src="https://checkout.stripe.com/checkout.js"></script>
</head>
Далее в теле объявить ссылку или кнопку с обработчиком нг кнопкой для вызова метода в контроллере:
<a href="" ng-click="onStripe('<%= StripeConstants.PUBLIC_API_KEY %>', '<%= request.getAttribute("email") %>')">Stripe Checkout via angularjs</a>
* Примечание: Моя страница является JSP и так как мой пользователь уже подписан в Я знаю, электронную почту, так что я толкать его к объекту запроса и вытащить его в мою страницу JSP. Аналогично, я загружаю свой открытый ключ Stripe (зашифрованный) из файла свойств, который находится на моем сервере. Опять же, я втягиваю это в свой JSP, а затем передаю как адрес электронной почты пользователя, так и открытый ключ Stripe в обработчик кликов в моем контроллере.
Это все для HTML-страницы. Теперь на контроллер.
Вам понадобятся две функции - обработчик кликов для вызова Stripe Checkout и функция обработки обратного вызова Stripe с маркером, представляющим данные платежа.
// stripe will call this once it has successfully created a token for the payment details
$scope.onToken = function(token) {
console.log(token);
// now call a service to push the necessary token info to the server to complete the checkout processing
};
$scope.onStripe = function(apiKey, userEmail) {
var handler = StripeCheckout.configure({
key: apiKey,
image: 'https://stripe.com/img/documentation/checkout/marketplace.png',
locale: 'auto',
token: $scope.onToken
});
handler.open({
panelLabel : 'Subscribe',
amount : 4995,
name : 'My Product Name here',
description : '$49.95 Monthly Subscription',
email : userEmail,
zipCode : true,
allowRememberMe : false
});
};
Это все!
Я не знаю достаточно Угловой, чтобы ответить на ваш вопрос, но не проще ли использовать существующую обертку, такую как этот: https://github.com/tobyn/angular-stripe-checkout? – Ywain