Некоторое время назад, поскольку Джейсон попросил меня помочь мне интегрировать оплату Stripe на его личный веб-сайт, что дало мне возможность связаться с разработкой платежной системы, и поскольку я не смог найти слишком много соответствующих документов на китайском языке, поэтому я сделал резюме, которое также удобно для будущих нуждающихся студентов.
О полосатых платежах
Впервые я услышал о Stripe в новостях несколько месяцев назад, грубо говоря, президент Соединенных Штатов использует его, и очень вероятно, что он будет успешным в следующем Paypal. В чем преимущество такой популярной платежной платформы? Я примерно собрал:
- Единый код позволяет вашему сайту поддерживать громоздкие функции международных платежей. (Для начинающих компаний это больше подходит)
- Расширение до глобального бизнеса станет возможностью для Stripe. Даже если валюта и способ оплаты отличаются, Stripe может открыть соответствующие каналы, чтобы глобальные транзакции не мешали оплате.
- Рыночная стоимость превышает 9 миллиардов долларов США, и он сотрудничает с Tweeter, Lyft, Best Buy и т. д., а также с местными Alipay, WeChat и т. д.
Сосредоточьтесь на втором пункте, что это значит, то есть клиенты могут платить в юанях, Если продавец (получатель платежа) является банком США, он будет автоматически конвертирован в доллары США, а если это британский банк, он будет автоматически конвертироваться в британские фунты стерлингов! (Жаль, что мерчант пока не поддерживается (но Stripe тоже может предоставить решение, заключающееся в использовании Atlas для создания агентской компании в США))
Нас, программистов, конечно, больше всего волнует первый пункт, потому что его цель — минималистичная разработка и супердружественность к разработчикам! О том, насколько это дружелюбно, см. ниже.
Самый простой платеж
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Stripe Checkout</title>
</head>
<body>
<form action="/your-server-side-code" method="POST">
<script
src="https://checkout.stripe.com/checkout.js" class="stripe-button"
data-key="[Publishable key]"
data-amount="999"
data-name="troy yang"
data-description="Widget"
data-image="https://stripe.com/img/documentation/checkout/marketplace.png"
data-locale="auto"
data-zip-code="true"
data-currency="eur">
</script>
</form>
</body>
</html>
Всего несколькими строками кода мы реализовали все на стороне клиента:
Это действительно очень просто, но этот метод основан на интерфейсе оплаты кредитной картой, который уже может удовлетворить половину способов оплаты.Для других трехсторонних платежей, таких как 3D Secure, Alipay, WeChat и даже Биткойн, Stripe предоставляет мы с другими методами, я буду использовать Alipay в качестве примера позже.
Зарегистрируйте учетную запись Stripe
Это то же самое, что зарегистрировать аккаунт Alipay.Сначала зарегистрируйте аккаунт, а потом привяжите свою банковскую карту.НО, как было сказано ранее, не поддерживает Китай, поэтому даже если регистрация прошла успешно, его нельзя активировать и нельзя забрать .
Что касается того, что делать с китайскими торговцами, я могу думать только о следующих способах:
- Перейти в поддержку страны, чтобы оформить банковскую карту
- Используйте банковскую карту иностранного друга
- Использование Атласа
Что касается Джейсона, поскольку он британец, он может создать свою основную учетную запись, а затем добавить мою полосатую учетную запись в свой список учетных записей членов команды, чтобы я мог получить доступ ко всем разрешениям, которые нужны разработчикам под его учетной записью. После успешного приглашения страница Dashboard
два этапа
Stripe имеет два режима: один — тестовый, а другой — производственный (режим реального времени). Денежные транзакции, сгенерированные в тестовом режиме, используются только для тестирования. Когда все тесты пройдены, его можно переключить в режим реального времени. Единственная разница в том,Publishable keyа такжеSecret key, мы будем использовать эти два значения через мгновение.
Процесс сделки
В Stripe есть несколько концепций, используемых на этапах и состояниях транзакций:
Создать источник
используй свой собственныйPublishable keyЧтобы создать источник (например, карты, 3D Secure, Alipay, даже биткойн и т. д.), после создания источника вы получите токен для транзакции или перейдете на другие поддерживаемые сторонние платежные платформы (например, платежная система Alipay). ) страница, ожидающая оплаты пользователем. Когда пользователь завершает платеж (или отменяет платеж), он автоматически возвращается на указанную страницу результатов. После завершения платежной страницы пользователя могут быть получены три состояния:
- source.chargeable Авторизация пользователя (оплата) прошла успешно
- source.failed Пользователь отказался от авторизации (платежа)
- source.отменена оплата сверхурочных
Создание заряда
Когда пользователь платит успешно, статус платежа на стороне Stripe становится source.chargeable, что означает, что авторизация прошла успешно, и вы можете списать деньги на моей платформе Alipay, поэтому в настоящее время нам все еще нужно использоватьSecret keyОфициальная рекомендация — использовать веб-перехватчики для регистрации статуса и завершения создания обвинения. Когда начисление будет завершено, весь платеж будет завершен, и будет получен статус начисления.успешно.
Используйте вебхуки
В Webhooks есть десятки состояний, все из которых будут зарегистрированы в месте, называемом обработчиком событий webhooks в Stripe.Мы можем указать, что при срабатывании различных событий данные пересылаются в веб-API, который мы создали сами. (На рисунке ниже показана конечная точка нашего сервера, потому что мы не используем сервер, мы используем Amazon lambda для создания бессерверной версии)
Подарите каштан Alipay
Сервер (бессерверный)
В качестве примера возьмем шлюз AWS Lambda + API: первый используется для определения API, а второй — для маршрутизации.
Создать код начисления:
'use strict';
const stripe = require('stripe')(process.env.STRIPE_SECRET_KEY);
exports.handler = (event, context, callback) => {
console.log("request: " + JSON.stringify(event));
let stripeData = event.data.object;
stripe.charges.create({
amount: stripeData.amount,
source: stripeData.id,
currency: stripeData.currency || 'usd',
description: 'My Englishtutor 30 days' || ('Stripe payment ' + event.id),
}, function(err, charge) {
if (err && err.type === 'card_error') {
context.fail(new Error(err.message));
}
else if (err) {
context.fail(err);
}
else {
context.succeed({ status: charge.status, success: true });
}
});
};
Клиент (Интернет)
Несколько реализаций:
Checkout
начало статьи
Код интеграции — это очень простой метод оформления заказа. Код интеграции непосредственно завершает клиентскую часть за вас, а серверу нужно только определить API-интерфейс хука для source.chargeable.При разработке Alipay я обнаружил, что Checkout можно использовать напрямую:
<form action="https://xxx.execute-api.eu-central-1.amazonaws.com/stripepayment/xxx" method="POST">
<script
src="https://checkout.stripe.com/checkout.js" class="stripe-button"
data-key="pk_test_xxx"
data-amount="30000"
data-name="myenglishtutor.eu"
data-label="Pay With Alipay"
data-description="30 days"
data-image="/images/logo.png"
data-locale="auto"
data-alipay="auto"
data-currency="usd">
</script>
</form>
Но всегда получайте эту ошибку:
Unrecognized request URL (POST: /v1/alipay/send_sms). Please see https://stripe.com/docs or we can help at https://support.stripe.com/.
Результат, полученный путем отправки электронного письма в службу поддержки Stripe, предназначен для будущего расширения. Stripe больше не предоставляет метод оплаты Alipay. У меня нет другого выбора, кроме как использовать следующий метод.
Stripe.js & Elements
Конечно, если вы считаете, что метод Checkout слишком интегрирован и недостаточно гибок, Stripe.js — ваш лучший выбор.
Stripe.js на самом деле является основной библиотекой классов JS на стороне клиента, а Elements — его библиотекой классов пользовательского интерфейса.На самом деле код Checkout выше инкапсулирован Stripe с использованием двух, чтобы предотвратить прямой контакт с конфиденциальной информацией, но его суть То же самое, используются для создания источника. Код клиента выложен непосредственно здесь (Elements здесь не используется для UI, т.к. это просто кнопочный платеж, он слишком простой, поэтому не используется):
var stripe = Stripe('pk_live_xxxx');
function alipay(amount) {
showLoading();
stripe.createSource({
type: 'alipay',
amount: parseInt(amount),
currency: 'gbp', // usd, eur,
redirect: {
return_url: 'https://xxx.eu/pay/result.html'
},
}).then(function (response) {
hideLoading();
if (response.error) {
alert(response.error.message);
}
else {
processStripeResponse(response.source);
}
});
}
function processStripeResponse(source) {
window.location.href = source.redirect.url;
}
Несколько замечаний:
- валюта должна быть валютой, в которой находится счет Stripe, то есть где находится привязанная банковская карта.Поскольку Джейсон британец, он должен использовать gbp (здесь я сделал ошибку здравого смысла, думая, что Соединенное Королевство также Член ЕС, поэтому пользуюсь евро, Результат был не тот, я плакала и прямо в туалете падала в обморок)
- return_url указывает, когда пользователь перенаправляется на нашу общую страницу оплаты Alipay, переходит обратно на страницу завершения платежа на этой странице возврата, потому что Alipay выполняет платеж синхронно, поэтому мы можем проверить статус платежа. завершено.
Когда все в порядке, нажмите кнопку оплаты, она перейдет на страницу оплаты Alipay (также доступны другие поддерживаемые сторонние платформы) следующим образом:
Первоначально перепечатано сTroy-like.com/2018/01/21/…