Amplify-js: Stripe API with aws amplify

Created on 16 Aug 2019  路  8Comments  路  Source: aws-amplify/amplify-js

Which Category is your question related to?

Lambda function.

What AWS Services are you utilizing?

API, Hosting, Storage, Auth

Provide additional details e.g. code snippets

This is step 3 where you send token to the server
Next, send the token to your server. This example shows how to send the token ID in the body of a POST request with the browser Fetch API. You can, however, use any approach that works for you.
image

So in our case, we don't have a server, so I send it to DynamoDb table. What is another way that I can do it here?

Then they will need to charge the customer in the server. So I have no idea what that means as we don't have server while using aws amplify do we?
image

Then what should I do in this step 4 using AWS Amplify? From my research, I need to use lambda function here but is there another way of doing this? If using Lamda function what should I write?

feature-request

Most helpful comment

Hey @jordanranz we have just done an amplify project with payments and obviously with stripe.

We have made REST api with amplify.
Amplify Rest API made a Node Js Express solution based on AWS API gateway endpoint and a lambda with Express.
With this REST, we develop an api endpoint that is called from frontend that receive Stripe Token, some user data and the id of the row of the table where there is the price.
The node function so is called and it call Stripe stripe.charges.create({...}). On the promise return of the stripe method, we save into DynamoDb if charges applies. Some other magic happens (transitional email to client, transitional email to admins, ...). And all works is done.

FRONTEND (angular 8) with ngx-stripe

return new Promise(function (resolve, reject) { self.stripeService .createToken(card, { name: self.user.email }) .subscribe(result => { if (result.token) { let options = { headers: {}, response: true, body: { type: 'stripe', subtype: 'creditcard', user: self.user.id, experience: experiencedateid, qty: qty, token: result.token, } } self.amplifyService.api().post(apiName, path, options).then(response => { console.log(response); resolve(response); }).catch(error => { console.log(error.response) reject(error); }); } else if (result.error) { // Error creating the token console.log(result.error.message); reject(result.error); } }); });

and LAMBDA with node stripe

`
const stripe = require('stripe')(process.env.STRIPE_SECRET_KEY);
const uuidv4 = require('uuid/v4');
const AWS = require('aws-sdk');
AWS.config.update({
region: process.env.REGION
});
var docClient = new AWS.DynamoDB.DocumentClient({
apiVersion: '2012-08-10'
});

module.exports.handler = (event, context, callback) => {
const requestBody = JSON.parse(event.body);
const type = requestBody.type;
const user = requestBody.user;
const experience = requestBody.experience;
const qty = requestBody.qty;

const token = requestBody.token.id;
const amount = "GET FROM DB";
const currency = requestBody.charge.currency;


return stripe.charges.create({ // Create Stripe charge with token
    amount,
    currency,
    description: 'PAY',
    source: token,
  })
  .then((charge) => { // Success response

SAVE SUCCESS OR FAIL
...`

In our develop journey was the best solution found...
Best regards! Ciao

All 8 comments

Hey @jordanranz we have just done an amplify project with payments and obviously with stripe.

We have made REST api with amplify.
Amplify Rest API made a Node Js Express solution based on AWS API gateway endpoint and a lambda with Express.
With this REST, we develop an api endpoint that is called from frontend that receive Stripe Token, some user data and the id of the row of the table where there is the price.
The node function so is called and it call Stripe stripe.charges.create({...}). On the promise return of the stripe method, we save into DynamoDb if charges applies. Some other magic happens (transitional email to client, transitional email to admins, ...). And all works is done.

FRONTEND (angular 8) with ngx-stripe

return new Promise(function (resolve, reject) { self.stripeService .createToken(card, { name: self.user.email }) .subscribe(result => { if (result.token) { let options = { headers: {}, response: true, body: { type: 'stripe', subtype: 'creditcard', user: self.user.id, experience: experiencedateid, qty: qty, token: result.token, } } self.amplifyService.api().post(apiName, path, options).then(response => { console.log(response); resolve(response); }).catch(error => { console.log(error.response) reject(error); }); } else if (result.error) { // Error creating the token console.log(result.error.message); reject(result.error); } }); });

and LAMBDA with node stripe

`
const stripe = require('stripe')(process.env.STRIPE_SECRET_KEY);
const uuidv4 = require('uuid/v4');
const AWS = require('aws-sdk');
AWS.config.update({
region: process.env.REGION
});
var docClient = new AWS.DynamoDB.DocumentClient({
apiVersion: '2012-08-10'
});

module.exports.handler = (event, context, callback) => {
const requestBody = JSON.parse(event.body);
const type = requestBody.type;
const user = requestBody.user;
const experience = requestBody.experience;
const qty = requestBody.qty;

const token = requestBody.token.id;
const amount = "GET FROM DB";
const currency = requestBody.charge.currency;


return stripe.charges.create({ // Create Stripe charge with token
    amount,
    currency,
    description: 'PAY',
    source: token,
  })
  .then((charge) => { // Success response

SAVE SUCCESS OR FAIL
...`

In our develop journey was the best solution found...
Best regards! Ciao

@bagubits this is a very nice solution. Perhaps it would make a good addition to the Amplify Community site as a post? https://amplify.aws/community/

I have the answer for this now in a slightly different way. I was using serverless and lambda function to receive a token from the serverless backend and create client and charge them. So instead of using express, you just need to install serverless and when deploying the function to serverless it will create an endpoint that you can use to receive token id from the front end.

Ciao @totaland ,
yes, your solution si good but involves serverless framework that is not part of the amplify framework directly. So in my opinion for programmers that start to master amplify, is simpler my solution:
$amplify add api
choose REST, generate /payments endpoints and then develop the solution...
Thanks for your point of view @totaland !!

@bagubits this is a very nice solution. Perhaps it would make a good addition to the Amplify Community site as a post? https://amplify.aws/community/

Ok, it will be! in the next week i'll try to write and submit! 馃殌

@bagubits hi, I was wondering if you have considered using Stripe Express accounts with AWS Amplify?

I'm looking into building a simple payments portal application and I am wondering if using Stripe Express would be an easy way to set it up.

https://stripe.com/docs/recipes/elements-react
This is an example of using React with Stripe and Express.

I believe the AWS Amplify has the RestAPI that allow you to use Express. I believe it is possible even though I didn't go down that part. Let's me know your attempt. I have done this using Serverless to get the charge to the customer part done.

Hey @jordanranz we have just done an amplify project with payments and obviously with stripe.

We have made REST api with amplify.
Amplify Rest API made a Node Js Express solution based on AWS API gateway endpoint and a lambda with Express.
With this REST, we develop an api endpoint that is called from frontend that receive Stripe Token, some user data and the id of the row of the table where there is the price.
The node function so is called and it call Stripe stripe.charges.create({...}). On the promise return of the stripe method, we save into DynamoDb if charges applies. Some other magic happens (transitional email to client, transitional email to admins, ...). And all works is done.

FRONTEND (angular 8) with ngx-stripe

return new Promise(function (resolve, reject) { self.stripeService .createToken(card, { name: self.user.email }) .subscribe(result => { if (result.token) { let options = { headers: {}, response: true, body: { type: 'stripe', subtype: 'creditcard', user: self.user.id, experience: experiencedateid, qty: qty, token: result.token, } } self.amplifyService.api().post(apiName, path, options).then(response => { console.log(response); resolve(response); }).catch(error => { console.log(error.response) reject(error); }); } else if (result.error) { // Error creating the token console.log(result.error.message); reject(result.error); } }); });

and LAMBDA with node stripe

`
const stripe = require('stripe')(process.env.STRIPE_SECRET_KEY);
const uuidv4 = require('uuid/v4');
const AWS = require('aws-sdk');
AWS.config.update({
region: process.env.REGION
});
var docClient = new AWS.DynamoDB.DocumentClient({
apiVersion: '2012-08-10'
});

module.exports.handler = (event, context, callback) => {
const requestBody = JSON.parse(event.body);
const type = requestBody.type;
const user = requestBody.user;
const experience = requestBody.experience;
const qty = requestBody.qty;

const token = requestBody.token.id;
const amount = "GET FROM DB";
const currency = requestBody.charge.currency;


return stripe.charges.create({ // Create Stripe charge with token
    amount,
    currency,
    description: 'PAY',
    source: token,
  })
  .then((charge) => { // Success response

SAVE SUCCESS OR FAIL
...`

In our develop journey was the best solution found...
Best regards! Ciao

Hi Ciao. Am new to Amplify and could you provide help. How can i implement Stripe subscription using Aws amplify and angular front end

Was this page helpful?
0 / 5 - 0 ratings