BennyThink/callback.html

## callback.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Payment status</title>
</head>
<body>

Your payment is {{redirect_status}}.

<br>
<br>
<table border="1">
    <tr>
        {% for key in data.keys() %}
        <td>{{key}}</td>
        {% endfor %}
    </tr>
    <tr>
        {% for value in data.values() %}
        <td>{{value}}</td>
        {% endfor %}

</table>


</body>
</html>

## checkout.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Checkout</title>
    <script src="https://js.stripe.com/v3/"></script>
</head>
<body>
<input id="pk" value="{{pk}}" hidden>
<input id="clientSecret" value="{{secret}}" hidden>
<input id="method" value="{{method}}" hidden>
<div id="error-message"></div>
<img id="wechat-qrcode">
</body>
<script>

    const pk = document.getElementById("pk").value
    const clientSecret = document.getElementById("clientSecret").value
    const method = document.getElementById("method").value
    let error = null;
    const stripe = Stripe(pk);

    if (method === "wechat_pay") {
        const {error, paymentIntent} =  stripe.confirmWechatPayPayment(
            clientSecret,
            {
                payment_method_options: {
                    wechat_pay: {
                        client: 'web',
                    },
                }
            },
        );

    } else if (method === "alipay") {
        error = stripe.confirmAlipayPayment(clientSecret, {
            // Return URL where the customer should be redirected after the authorization
            return_url: `${window.location.origin}/callback`,
        });
    } else {
        alert("Invalid payment method")
    }


    if (error) {
        // Inform the customer that there was an error.
        const errorElement = document.getElementById('error-message');
        errorElement.textContent = error.message;
    }
</script>
</html>

## index.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Checkout</title>
</head>
<body>
<form method="post" action="/checkout">
    <h1>Choose payment method and amount</h1>
    <select name="method">
        <option value="alipay">Alipay</option>
        <option value="wechat_pay">WeChat</option>
    </select>
    <input type="text" name="amount">元
    <button id="payment-button">
        Submit Payment
    </button>
</form>
</body>
<script>

</script>
</html>

## main.py
import logging
import stripe
import time
from flask import Flask, request, render_template

logging.basicConfig(level=logging.INFO)
stripe.api_key = "sk_test9lxNH"

app = Flask(__name__)

pk = "pk_test_OuQ"


@app.route('/')
def index():
    return render_template("index.html")


@app.route('/checkout', methods=['POST'])
def checkout():
    method = request.form['method']
    # unit is 分
    amount = int(float(request.form['amount']) * 100)
    # create payment intent
    logging.info("method: %s, amount: %s", method, amount)
    intent = stripe.PaymentIntent.create(payment_method_types=[method], amount=amount, currency="cny")
    secret = intent.client_secret
    return render_template('checkout.html', pk=pk, secret=secret, method=method)


def ts_to_date(ts):
    return time.strftime("%Y-%m-%d %H:%M:%S", time.localtime(ts))


@app.route('/callback')
def callback():
    payment_intent = request.args.get("payment_intent")
    redirect_status = request.args.get("redirect_status")
    data = stripe.PaymentIntent.retrieve(payment_intent)
    display_info = {
        "amount": data["amount"] / 100,
        "currency": data["currency"],
        "created": ts_to_date(data["created"]),
        "payment_method": data["payment_method_types"],
    }
    return render_template('callback.html', redirect_status=redirect_status, data=display_info)


if __name__ == '__main__':
    app.run(debug=True)
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>Payment status</title>
	</head>
	<body>

	Your payment is {{redirect_status}}.

	<br>
	<br>
	<table border="1">
	<tr>
	{% for key in data.keys() %}
	<td>{{key}}</td>
	{% endfor %}
	</tr>
	<tr>
	{% for value in data.values() %}
	<td>{{value}}</td>
	{% endfor %}

	</table>


	</body>
	</html>
	import logging
	import stripe
	import time
	from flask import Flask, request, render_template

	logging.basicConfig(level=logging.INFO)
	stripe.api_key = "sk_test9lxNH"

	app = Flask(__name__)

	pk = "pk_test_OuQ"


	@app.route('/')
	def index():
	return render_template("index.html")


	@app.route('/checkout', methods=['POST'])
	def checkout():
	method = request.form['method']
	# unit is 分
	amount = int(float(request.form['amount']) * 100)
	# create payment intent
	logging.info("method: %s, amount: %s", method, amount)
	intent = stripe.PaymentIntent.create(payment_method_types=[method], amount=amount, currency="cny")
	secret = intent.client_secret
	return render_template('checkout.html', pk=pk, secret=secret, method=method)


	def ts_to_date(ts):
	return time.strftime("%Y-%m-%d %H:%M:%S", time.localtime(ts))


	@app.route('/callback')
	def callback():
	payment_intent = request.args.get("payment_intent")
	redirect_status = request.args.get("redirect_status")
	data = stripe.PaymentIntent.retrieve(payment_intent)
	display_info = {
	"amount": data["amount"] / 100,
	"currency": data["currency"],
	"created": ts_to_date(data["created"]),
	"payment_method": data["payment_method_types"],
	}
	return render_template('callback.html', redirect_status=redirect_status, data=display_info)


	if __name__ == '__main__':
	app.run(debug=True)