I'm using stripe-react-native to handle payment, and I'm able to handle one-time payment via payment-sheet using PaymentIntent flow.
Now I'm stuck with creating subscription using the same payment sheet flow, has anyone tried this before? Or an advise how to use PaymentIntent in subscription?
You need to expand the subscription object with payment intent.
const subscription = await stripe.subscriptions.create({
...subscriptionSettings
expand: ['latest_invoice.payment_intent']
});
You can then access it using:
const paymentIntent = subscription.latest_invoice.payment_intent
const clientSecret = subscription.latest_invoice.payment_intent.client_secret
Related
I have a SvelteKit app and am using Firebase and Node to do simple Google SSO auth. I am using an API that requires the IDToken of the currently signed in user to authenticate requests. Ideally I'd like to use the +page.ts load function to load in the data, something like this:
export const load = (async () => {
// Get user, token
const auth = getAuth();
const user = auth.currentUser;
const token = await user?.getIDToken();
if (!token) throw error(401, "Could not authenticate");
// Use token to get data needed to load page
const data = api.requestData(token);
return { data };
}) satisfies PageLoad;
export const ssr = false;
The issue is that user is always null when this function executes. I imagine this is because this is called before the page loads and Firebase hasn't had a way to access the session and get the current user.
My question is, what approach do I take to solve this without simply requesting the data after the page is rendered? Is there a way to authenticate the user server side? Thanks so much.
i was trying to migrate from old google login library to new gis library, during the process i was not able to implement refresh token logic. my app gets logout every hour the token gets expire and user have to login again. which is not good for my customer experience. please help
i tried using Javascript api code from the official website [https://developers.google.com/identity/gsi/web/reference/js-reference]
<script>
window.onload = function () {
google.accounts.id.initialize({
client_id: 'YOUR_GOOGLE_CLIENT_ID',
callback: handleCredentialResponse
});
google.accounts.id.prompt();
};
</script>
I want to try the invoicing API in vuejs.
The code example I want to apply is
// Set your secret key. Remember to switch to your live secret key in production.
// See your keys here: https://dashboard.stripe.com/apikeys
const stripe = require('stripe')(
'sk_test_51M6ZtzIWDjpHNQK1pihAHQGM9Hh7aGVggo7yICRvYNUPqmHA2nIB9OLU6UrVmnWU8Spzcl1ZkPdRZu6zYCSVO7fi008peIrX1g'
);
const customer = await stripe.customers.create({
email: 'jenny.rosen#example.com',
payment_method: 'pm_card_visa',
invoice_settings: {default_payment_method: 'pm_card_visa'},
});
This does'nt work and I get the error
Require is not defined
How to change this piece of code ?
I'm using Stripe with react-native and I want to integrate PaymentIntent with Subscription as described in this tutorial
the issue is I can't show the SEPA as a valid payment option at the front-end.
Stripe mentioned in their subscription API docs that you can pass the payment_method_types as you do in payment_intent. however, it seems like it doesn't work!
let me explain with examples
first scenario using the regular payment_intent
const paymentIntent = await stripe.paymentIntents.create({
amount: 1099,
currency: 'EUR',
customer: customer.id,
payment_method_types: ["card", "sepa_debit"]
});
return res.json({
// #ts-ignore
paymentIntent: paymentIntent.client_secret,
ephemeralKey: ephemeralKey.secret,
customer: customer.id,
});
and the result would be like as you can see the SEPA option is showing
second scenario when I'm using the subscription
const subscription = await stripe.subscriptions.create({
customer: customer.id,
items: [{
price: "price_1JwZ4tJyYehXW8ayueOKGDUM",
}],
payment_settings: {
payment_method_types: ["card", "sepa_debit"]
},
payment_behavior: 'default_incomplete',
expand: ['latest_invoice.payment_intent'],
});
return res.json({
// #ts-ignore
paymentIntent: subscription.latest_invoice.payment_intent.client_secret,
ephemeralKey: ephemeralKey.secret,
customer: customer.id,
});
the result would be like (no SEPA option)
any idea why sepa_debit working with payment_intent and not with subscription?
The Payment Intent that is generated during Subscription creation automatically sets setup_future_usage: off_session to ensure that the saved Payment Method can be used for off-sessions recurring payments in the future.
Looking at the code for Stripe's React Native SDK it looks like it relies on logic found in the Android and iOS to determine when to show sepa_debit as an option in the Payment Sheet. Both these SDKs do not currently support sepa_debit for a Payment Intent with setup_future_usage set, which explains why you're not seeing it show up as an option for your Subscription Payment Intent. You can see the code I referenced here:
Android
iOS
i saw something similar here: How do you authenticate a VueJS app with Azure AD?
but it did not work for me...
my problem is that after authenticating the user at login - i still needed to get the users security groups and that information was not received using the graph-api described in the above mentioned post
thank you for any help
it was something that took me a long time to figure out so im posting my findings here, hopfully this will help someone:
this was a hard one for me so im posting here - hopfully this will save some time to someone:
my problem was that i need not only to authenticate my vuejs app with azure-ad, but i need also to get the security groups to which the user is belonging to.
to achive this, this is what i done:
i used the vue-adal sample app mentioned above( you can find it in: https://github.com/survirtual/vue-adal ) - under sample folder.
but i still had to make some changes to make it behave the way i need. the problam was that after logging in with my user the sample app used windows.net graph api for retrieving user info with the token from the user authentication, so i had to change in main.js this:
const graphApiBase = `https://graph.windows.net`
const graphApiResource = '00000002-0000-0000-c000-000000000000'
to this:
const graphApiBase = `https://graph.microsoft.com/v1.0`
const graphApiResource = '00000003-0000-0000-c000-000000000000'
in addition, inside the return url component i had to change the axios query to get the security groups to which the user belongs to..so i changed this (in the home.vue file):
async getUserInfo () {
let res = await this.$graphApi.get(`me`, {
params: {
'api-version': 1.6
}
})
to this:
async getUserInfo () {
let res = await this.$graphApi.post(`/me/getMemberGroups`, {
securityEnabledOnly: true
})
console.log(res)
return res.data
}
and then the data that i received back from the api contained the security groups to which the user belongs to...