Add Python implementation of the server (#14)

.env.example

@@ -12,6 +12,9 @@ STRIPE_SECRET_KEY=
 # After creating a webhook, click to reveal details and find your signing secret.
 STRIPE_WEBHOOK_SECRET=
 
+# Stripe account country (required for Payment Request).
+STRIPE_ACCOUNT_COUNTRY=US
+
 # Optional ngrok configuration for development (if you have a paid ngrok account).
 NGROK_SUBDOMAIN=
-NGROK_AUTHTOKEN=
+NGROK_AUTHTOKEN=

README.md

@@ -28,10 +28,12 @@ This demo provides an all-in-one example for integrating with Stripe on the web:
 
 ## Payments Integration
 
+The frontend code for the demo is in the `public/` directory.
+
 The core logic of the Stripe integration is mostly contained within two files:
 
 1.  [`public/javascripts/payments.js`](public/javascripts/payments.js) creates the payment experience on the frontend using Stripe Elements.
-2.  [`server/routes.js`](server/routes.js) defines the routes on the backend that create Stripe charges and receive webhook events.
+2.  [`server/node/routes.js`](server/routes.js) defines the routes on the backend that create Stripe charges and receive webhook events.
 
 ### Card Payments with Stripe Elements
 
@@ -55,7 +57,11 @@ The [Sources API](https://stripe.com/docs/sources) provides a single integration
 
 ![Stripe Payment Settings](public/images/screenshots/stripe-payments-settings.png)
 
-## Requirements
+## Getting Started with Node
+
+There are a couple server implementations in the [`server`](/server) directory. Instructions for running the Node.js server in [`server/node`](/server/node) are below, but if you’re more comfortable with Python you can find a README explaining how to run a Flask server in the [`server/python`](/server/python) directory. Both servers have the same endpoints to handle requests from the frontend and interact with the [Stripe libraries](https://stripe.com/docs/libraries).
+
+### Requirements
 
 You’ll need the following:
 
@@ -67,13 +73,13 @@ In your Stripe Dashboard, you can [enable the payment methods](https://dashboard
 
 Some payment methods require receiving a real-time webhook notification to complete a charge. This demo is bundled with [ngrok](https://ngrok.com/), which allows us to securely receive webhooks and serve the app locally via HTTPS, which is also required to complete transactions in the browser with Elements or the Payment Request API.
 
-## Getting Started
+### Running the Node Server
 
-Copy the environment variables file:
+Copy the environment variables file from the root of the repository:
 
     cp .env.example .env
 
-Update `.env` with your own [Stripe API keys](https://dashboard.stripe.com/account/apikeys) and any other configuration details. These environment variables are loaded and used in [`config.js`](config.js), where you can review and edit other options such as the app currency and your Stripe account country.
+Update `.env` with your own [Stripe API keys](https://dashboard.stripe.com/account/apikeys) and any other configuration details. These environment variables are loaded and used in [`server/node/config.js`](/server/node/config.js), where you can review and edit other options such as the app currency and your Stripe account country.
 
 Install dependencies using npm:
 

package.json

@@ -1,7 +1,7 @@
 {
   "name": "stripe-payments-demo",
   "description":
-    "Sample store accepting universal payments on the web with Stripe Elements, Payment Request, Apple Pay, Google Pay, and the Sources API.",
+    "Sample store accepting universal payments on the web with Stripe Elements, Payment Request, Apple Pay, Google Pay, Microsoft Pay, and the Sources API.",
   "version": "0.0.1",
   "private": true,
   "author": "Romain Huet",
@@ -14,7 +14,7 @@
     "node": "8.x"
   },
   "scripts": {
-    "start": "node server/server.js"
+    "start": "node server/node/server.js"
   },
   "dependencies": {
     "body-parser": "^1.17.1",

server/node/README.md

@@ -0,0 +1,53 @@
+# Stripe Payments Demo — Node Server
+
+This directory contains the main Node implementation of the payments server.
+
+## Requirements
+
+You’ll need the following:
+
+* [Node.js](http://nodejs.org) >= 8.x.
+* Modern browser that supports ES6 (Chrome to see the Payment Request, and Safari to see Apple Pay).
+* Stripe account to accept payments ([sign up](https://dashboard.stripe.com/register) for free).
+
+In your Stripe Dashboard, you can [enable the payment methods](https://dashboard.stripe.com/payments/settings) you’d like to test with one click.
+
+Some payment methods require receiving a real-time webhook notification to complete a charge. This demo is bundled with [ngrok](https://ngrok.com/), which allows us to securely receive webhooks and serve the app locally via HTTPS, which is also required to complete transactions in the browser with Elements or the Payment Request API.
+
+## Getting Started
+
+Copy the environment variables file from the root of the repository:
+
+    cp .env.example .env
+
+Update `.env` with your own [Stripe API keys](https://dashboard.stripe.com/account/apikeys) and any other configuration details. These environment variables are loaded and used in [`server/node/config.js`](/server/node/config.js), where you can review and edit other options such as the app currency and your Stripe account country.
+
+Install dependencies using npm:
+
+    npm install
+
+This demo uses the Stripe API as a datastore for products and orders, but you can always choose to use your own datastore instead. When starting the app for the first time, the initial loading can take a couple of seconds as it will automatically set up the products within Stripe.
+
+Run the app:
+
+    npm run start
+
+Two public ngrok URLs will be provided when the app starts. The first URL should be used to [setup webhooks](https://dashboard.stripe.com/account/webhooks) in your Stripe Dashboard. For example:
+
+    https://<example>.ngrok.io/webhook
+
+The second URL will serve our app via HTTPS. For example:
+
+    https://<example>.ngrok.io
+
+Use this second URL in your browser to start the demo.
+
+**Don’t want to use ngrok?** As long as you serve the app over HTTPS and that Stripe can reach the webhook endpoint via a public URL, all the payment flows will work.
+
+**Want to test a hosted version of this app with your own Stripe account?** You can deploy an instance of this app on Heroku and set up your own API keys:
+
+[![Deploy](https://www.herokucdn.com/deploy/button.svg)](https://heroku.com/deploy)
+
+## Credits
+
+* Code: [Romain Huet](https://twitter.com/romainhuet) and [Thorsten Schaeff](https://twitter.com/schaeff_t)

config.js → server/node/config.js

@@ -24,7 +24,7 @@ module.exports = {
   // You can fill them in your own `.env` file.
   stripe: {
     // The two-letter country code of your Stripe account (required for Payment Request).
-    country: 'US',
+    country: process.env.STRIPE_ACCOUNT_COUNTRY || 'US',
     // API version to set for this app (Stripe otherwise uses your default account version).
     apiVersion: '2018-02-06',
     // Use your test keys for development and live keys for real charges in production.

server/inventory.js → server/node/inventory.js

@@ -9,7 +9,7 @@
 
 'use strict';
 
-const config = require('../config');
+const config = require('./config');
 const stripe = require('stripe')(config.stripe.secretKey);
 stripe.setApiVersion(config.stripe.apiVersion);
 

server/routes.js → server/node/routes.js

@@ -9,7 +9,7 @@
 
 'use strict';
 
-const config = require('../config');
+const config = require('./config');
 const setup = require('./setup');
 const {orders, products} = require('./inventory');
 const express = require('express');

server/server.js → server/node/server.js

@@ -7,7 +7,7 @@
 
 'use strict';
 
-const config = require('../config');
+const config = require('./config');
 const express = require('express');
 const logger = require('morgan');
 const bodyParser = require('body-parser');
@@ -28,7 +28,7 @@ app.use(
   })
 );
 app.use(bodyParser.urlencoded({extended: true}));
-app.use(express.static(path.join(__dirname, '../public')));
+app.use(express.static(path.join(__dirname, '../../public')));
 app.engine('html', require('ejs').renderFile);
 app.set('view engine', 'html');
 

server/setup.js → server/node/setup.js

@@ -9,7 +9,7 @@
 
 'use strict';
 
-const config = require('../config');
+const config = require('./config');
 const stripe = require('stripe')(config.stripe.secretKey);
 stripe.setApiVersion(config.stripe.apiVersion);
 

server/python/.gitignore

@@ -0,0 +1,8 @@
+# Python environment files
+venv
+env
+
+# Python compiled resources + JetBrains 
+__pycache__/
+.pytest_cache/
+.idea

server/python/Procfile

@@ -0,0 +1 @@
+web gunicorn app:app

server/python/README.md

@@ -0,0 +1,90 @@
+# Stripe Payments Demo — Python Server
+
+This demo uses a simple [Flask](http://flask.pocoo.org/) application as the server.
+
+## Payments Integration
+
+* [`app.py`](app.py) contains the routes that interface with Stripe to create charges and receive webhook events.
+* [`setup.py`](setup.py) a simple setup script to make some fake Products and SKUs for our Stripe store.
+* [`tests/tests.py`](tests/tests.py) some unit tests that test the logic of our heavier APIs like `orders/<string:id>/pay` and `/webhook`.
+* [`test_data.py`](tests/tests.py) contains some hardcoded mocked responses to test with.
+* [`inventory_manager.py`](stripe_lib.py) a minimal wrapper over the Stripe Python SDK that handles creating/fetching orders and products. You can override this class with your own order management system code.
+
+## Requirements
+
+You’ll need the following:
+
+* [Python 3.6.5](https://www.python.org/downloads/release/python-365/)
+* Modern browser that supports ES6 (Chrome to see the Payment Request, and Safari to see Apple Pay).
+* Stripe account to accept payments ([sign up](https://dashboard.stripe.com/register) for free!)
+
+## Getting Started
+
+Before getting started, check to see that you have the right version of Python installed (3.6.5).
+
+```
+python3 --version
+```
+
+_If your machine is running Python 2 as the default then you can follow these great guides on installing Python 3 for [macOS](http://docs.python-guide.org/en/latest/starting/install3/osx/), [Windows](http://docs.python-guide.org/en/latest/starting/install3/win/), or [Linux](http://docs.python-guide.org/en/latest/starting/install3/linux/)._
+
+Once you have Homebrew and Python 3 set up, copy the example environment variables file `.env.example` from the root of the repo into your own environment file called `.env`:
+
+```
+cp .env.example .env
+```
+
+Update your `.env` file with your own [Stripe API keys](https://dashboard.stripe.com/account/apikeys) and any other configuration details you might want to add. The env variables are managed via the [python-dotenv](https://github.com/theskumar/python-dotenv) package.
+
+Create a [virtual environment](https://docs.python.org/3/tutorial/venv.html) to manage the packages and state our application needs:
+
+```
+cd server/python
+python3 -m venv env
+source env/bin/activate
+```
+
+Run `pip install` to fetch the Python packages we use:
+
+```
+pip install -r requirements.txt
+```
+
+Export our Flask app and run!
+
+```
+export FLASK_APP=app.py
+flask run
+```
+
+You should now see it running on [`http://127.0.0.1:5000/`](http://127.0.0.1:5000/)
+
+### Testing Webhooks
+
+If you want to test [receiving webhooks](https://stripe.com/docs/webhooks), we recommend using ngrok to expose your local server.
+
+First [download ngrok](https://ngrok.com) and start your Flask application.
+
+[Run ngrok](https://ngrok.com/docs). Assuming your Flask application is running on the default port 5000, you can simply run ngrok in your Terminal in the directory where you downloaded ngrok:
+
+```
+./ngrok http 5000
+```
+
+ngrok will display a UI in your terminal telling you the new forwarding address for your Flask app. Use this URL as the URL to be called in your developer [webhooks panel.](https://dashboard.stripe.com/account/webhooks)
+
+Don't forget to append `/webhook` when you set up your Stripe webhook URL in the Dashboard. Example URL to be called: `http://75795038.ngrok.io/webhook`.
+
+## Tests
+
+You can find tests for the API located in the `tests` directory. Make sure you're running in the virtual environment you created earlier.
+
+```
+souce env/bin/activate
+cd tests
+python tests.py
+```
+
+## Credits
+
+* Code: [Adrienne Dreyfus](http://twitter.com/adrind)