#Adal-Checkout
surreal whale
Hi! thanks for responding, yes, first and second screenshots are frontend and third is the API
glacial jackal
Cool, can you do a console.log and see what does the fetch('/api/checkout_sessions') returns?
Ideally the fetch('/api/checkout_sessions') should return a session object, and so that you can call window.open(session.url) to open the checkout page.
glacial jackal
Alternatively you can open devtool and check the response from your server on the network tab.
surreal whale
humm.. it says "Failed to load response data: No content available because this request was redirected"
on the response inside network tab
glacial jackal
Ah, I see, you return 302 in your backend.
surreal whale
In the headers I get a 303 status code "see other"
glacial jackal
can you send me the backend end?
surreal whale
It's the boilerplate from the code example in the docs 😅 I just changed the price part to get the ID from the item from the front end
glacial jackal
Got it, if you are returning 303 from backend, you need to use form submit.
surreal whale
And in my console I get my console logs
surreal whale
Got it, if you are returning 303 from backend, you need to use form submit.
Oooooh yeah yeah, that's what the example is using
glacial jackal
Yeah, can you check to form and try again?
surreal whale
But I didn't think it was suitable to my case so I used a button 😅
The boiler plate with the form works, but I have to hardcode in the backend the price id
glacial jackal
If you don't want to use form, you can return a 200 with a session object
surreal whale
That's why I switched to a button, so I could use the onClick function which grabs the price id from the specific product
surreal whale
If you don't want to use form, you can return a 200 with a session object
Ok ok, I'll try that!
glacial jackal
then use window.open(session.url) to open the checkout page at your frontend js
surreal whale
Ok let me test that
wait, so do I just change the 303 for 200? and then window.open(session.url);, or do I switch it to res.status and then the window.open? 🤔
glacial jackal
You can replace res.redirect() with res.send(session) to return a 200 with session object to client end.
surreal whale
huummm
if I change the previous to res.send(session) I get my console logs correctly, but still don't redirect, in the network tab I can see the payload correctly as my price_id and from response I get
an object with a lot of stripe info
glacial jackal
You need to add some code in your button handling, something like
const session = await fetch('/api/checkout_sessions'...
window.open(session.url);
Hmm I think I'm close, it's weird because
if I do this
It finally opens the stripe site, the bad thing is that it tries to open as a pop up window and can be blocked... and also I find worry that since I didn't access it using the session.url I won't be able to redirect..
glacial jackal
Try window.open(session.url, '_self');
glacial jackal
Nice! Happy to know that your problem is resolved!
surreal whale
The function is firing at render time tho 😅 but that must be me being dumb having problems with syntax somewhere lol, but looks like the redirecting problem is solved
Do you think there won't be any problem for not using the "session" thing?
glacial jackal
What do you mean not using the session thing? You are using Checkout Session API.
surreal whale
I mean haha, because when I tried to redirect to data.session.url I gont undefined, but it worked as data.url since I inspected in the console, I guess I just renamed the whole object as data
glacial jackal
That's just a variable name, you can name it whatever you want.
glacial jackal
Don't worry! I'm happy to help 🙂