Comments (7)
@donemmx it looks like you're importing the stripe node library rather than Stripe.js. You will want to do this instead: https://github.com/stripe/stripe-js#installation
import {loadStripe} from '@stripe/stripe-js';
const stripe = await loadStripe('pk_test_TYooMQauvdEDq54NiTphI7jx');
stripe.redirectToCheckout({ sessionId });
from stripe-firebase-extensions.
thank you so much it works. no more errors...hurray... awesome
from stripe-firebase-extensions.
You need to make the onSnapshot
callback function async so that you can call await
within it:
// Wait for the CheckoutSession to get attached by the extension
docRef.onSnapshot(async (snap) => {
const { sessionId } = snap.data();
if (sessionId) {
// We have a session, let's redirect to Checkout
// Init Stripe
const stripe = await loadStripe("pk_test_*****************");
stripe.redirectToCheckout({ sessionId });
}
});
from stripe-firebase-extensions.
Glad to hear that π
from stripe-firebase-extensions.
Its really of a big concern because i really need it to redirect me to stripe checkout from my angular app
from stripe-firebase-extensions.
please how where do i add const stripe = await loadStripe('pk_test_TYooMQauvdEDq54NiTphI7jx'); this line that won't make it throw errors.
i am quite new to this.
from stripe-firebase-extensions.
import { AngularFirestore } from '@angular/fire/firestore';
import { ServicesClass } from './../services/service';
import { Component, OnInit } from '@angular/core';
import {loadStripe} from '@stripe/stripe-js';
@component({
selector: 'app-plans',
templateUrl: './plans.component.html',
styleUrls: ['./plans.component.css'],
})
export class PlansComponent implements OnInit {
plans;
constructor(private afs: AngularFirestore, public service: ServicesClass) {
this.afs
.collection('products')
.ref.where('active', '==', true)
.get()
.then(function (querySnapshot) {
querySnapshot.forEach(async function (doc) {
console.log(doc.id, ' => ', doc.data());
const priceSnap = await doc.ref.collection('prices').get();
priceSnap.docs.forEach((doc) => {
console.log(doc.id, ' => ', doc.data());
});
});
});
}
async subscribe() {
const docRef = await this.afs
.collection('users')
.doc(this.service.userData.uid)
.collection('checkout_sessions')
.add({
price: 'price_1GqIC8HYgolSBA35zoTTN2Zl',
success_url: window.location.origin,
cancel_url: window.location.origin,
});
// Wait for the CheckoutSession to get attached by the extension
docRef.onSnapshot((snap) => {
const { sessionId } = snap.data();
if (sessionId) {
// We have a session, let's redirect to Checkout
// Init Stripe
// const stripe = Stripe('pk_test_*****************');
// );
const stripe = await loadStripe('pk_test_TYooMQauvdEDq54NiTphI7jx');
stripe.redirectToCheckout({ sessionId });
}
});
}
ngOnInit(): void {}
}
from stripe-firebase-extensions.
Related Issues (20)
- Update to node 18 or 20 -> Node 14 will be deprecated on january 31 HOT 12
- Webhook handler for Stripe event failed: User not found! HOT 6
- createCustomer is not triggered
- createPortalLink success_url HOT 1
- success_url and cancel_url not working in mobile
- CustomClaims "stripeRole" is removed on overdue subscriptions.
- Firebase stripe extension Error creating secrets HOT 5
- Upgrade Cloud Functions to v2 (Gen2) HOT 4
- Support trial βΒ there's no longer the legacy option for setting a trial in Stripe HOT 2
- Dragon
- Dragon
- Webhook handler not updating cancellation details on Firebase. HOT 4
- cancel/resume/update subscriptions directly from firestore-stripe-payments
- Interacting with subscriptions in firestore-stripe-web-sdk
- Error installing HOT 1
- Extension requires deprecated feature of Stripe to support free trials for subscriptions HOT 4
- Embedded Payment Form
- Error: No such customer: 'cus_....' HOT 1
- extension double-charging customers for old invoices?!
- getStripePayments -> ERROR FirebaseError: Expected first argument to collection() to be a CollectionReference, a DocumentReference or FirebaseFirestore HOT 6
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from stripe-firebase-extensions.