I seam to be having issues getting the “Charge ID” from stripe, this is in test mode and in live site bills in GBP not USD but this should not matter.
Any Ideas Here is the site collectyourrent.co.uk “payment screen is behind the Make A Payment button”
Code is here;
Code In Light Box
import {createToken, encodeCard} from "public/stripeAPI.js";
import {charge} from 'backend/stripeProxy';
var payment;
export function payNow(event) {
createToken(encodeCard(createCard()))
.then((token) => {
console.log("Card token: " + token);
charge(token, payment)
.then((chargeResponse) => {
console.log("Charge ID: " + chargeResponse.id);
});
});
}
function createCard() {
return {
"name": $w("#cname").value,
"number": $w("#cnumber").value,
"cvc": $w("#cvc").value,
"exp_year": $w("#year").value,
"exp_month": $w("#month").value
};
}
function changeState() {
payment = {
"amount": ($w("#amt").value * 100),
"currency": "GBP",
"description": $w("#desc").value
}
}
export function chargeCard_click(event) {
payNow();
}
export function cname_change(event) {
changeState();
}
export function desc_change(event) {
changeState();
}
Public
import {fetch} from 'wix-fetch';
export async function createToken(card) {
const apiKey = "pk_test_8KDFnXyoAcEMvKYzqUVi8Kva";
const response = await fetch("https://api.stripe.com/v1/tokens", {
method: 'post',
headers: {
"Content-Type": "application/x-www-form-urlencoded",
"Authorization": "Bearer " + apiKey
},
body: card
});
if (response.status >= 200 && response.status < 300) {
const json = await response.json()
return json.id;
}
const responseText = await response.text();
console.log(responseText);
return response.status;
}
export function encodeCard(card){
let encoded = "";
for (let [k, v] of Object.entries(card)) {
encoded = encoded.concat("card[", k, "]=", encodeURI(v), "&");
}
return encoded.substr(0, encoded.length - 1);
}
Backend
import {fetch} from 'wix-fetch';
export async function charge(token,payment) {
const cart = payment;
const apiKey = "CODE IS IN HERE BUT NO ON THIS POST ";
const response = await fetch("https://api.stripe.com/v1/charges", {
method: 'post',
headers: {
"Content-Type": "application/x-www-form-urlencoded",
"Authorization": "Bearer " + apiKey
},
body: encodeBody(token, cart)
});
if (response.status >= 200 && response.status < 300) {
return await response.json();
}
return await response.text();
}
function encodeBody(token, cart){
let encoded = "";
for (let [k, v] of Object.entries(cart)) {
encoded = encoded.concat(k,"=", encodeURI(v), "&");
}
encoded = encoded.concat("source=", encodeURI(token));
return encoded;
}