Hey folks! Some of you mentioned that what I showed you in the video doesn't work for Stripe live, and I am sorry to say that it is true. HOWEVER! There is an easy solution to that, basically, we need to have our simple HTML deployed on the Https website and it will still work! I've put the same HTML in a repository (github.com/MarcinusX/test1/blob/main/index.html) and deployed it on GitHub pages (marcinusx.github.io/test1/index.html) and it worked on live! I've just paid myself 2 PLN :D I'm sorry for not checking it on live before publishing. Let me know if it works for you.
You prolly dont care but if you guys are stoned like me during the covid times you can watch pretty much all the latest series on InstaFlixxer. Have been watching with my gf for the last couple of months xD
Big thanks so far (from this beginner). Stripe have done an excellent job of improving the introductory documentation, but then the reader seems to be cast straight into API details. An explanatory step was missing and you seem to have provided it. I think it was a good idea to include the sort of thing one will be doing server-side with a simple local class, which gives one confidence to go ahead and complete the actual server code. Great stuff.
We don't need to pass session id, we can directly pass the checkout url, that we get from the response from the server. BTW a great tutorial was looking for this for a long time, as the new flutter stripe package is in beta, and has a lot of bugs. I am happy I have found this video
Thanks for the video man, today there are flutter packages available and you can use them. But this video is helpful if you wanna use any payment gateway with webview. Thanks again
@@rawquesh I searched but didn't got any solution , so made seperate html page and hosted in firebase , got the https URL then replaced the URL in code
@@fidev-makebeautifulapps1498 Someone who can decompile the app which may expose the code up-to an extent.(But reverse engineering is kind-off tough to do with flutter app so it's not a problem)
error when using live mode "Uncaught IntegrationError: Live Stripe.js integrations must use HTTPS. For more information: stripe.com/docs/security/guide#tls", source: js.stripe.com/v3/ (1)
You can have checkout session id in the success URL. From that you'd have to ask backend for the product details based on that id. See stripe.com/docs/payments/checkout/custom-success-page#modify-success-url for example
@@fidev-makebeautifulapps1498 i'm actually using woocommerce rest api so i have to put the transaction id in the payment receipt so i need to have transaction id
@@fidev-makebeautifulapps1498 . sorry but i don't understand well. imagine that i'm in my ecommerce website and want to save the price of any article. what can i do ? according to your method, it will be always the same price ? my question is how can i do to set "nikesPriceId" for any product in my backend. please more explication sir.🙏
@@fidev-makebeautifulapps1498 cool Just to check again (since I am seemingly dumb). On mobile via webview this supports Address auto-complete Real-time card validation Descriptive error messages Third-party autofill Card brand identification Right? :D
@@lassediercks4766 As far as I know, mostly yes. It doesn't collect address though and I don't know what you mean by third-party autofill. The whole idea of Stripe Checkout is that Stripe handles all of those things. The best bet is to go to stripe.com/en-gb/payments/checkout and see if it fits your needs. :) EDIT: Oh, you got it from their website! So yeah, I don't see why it should not work in the webview :)
@@fidev-makebeautifulapps1498 hi we tried doing this on mobile but it seems that webview on mobile cannot access device autofill information. Does it rly work for you it might be we made a mistake? Br Lasse
From what I understood, this error is happening because evaluateJavascript method doesn't return anything. So I don't think it actually is an error worth handling. Of course I may be wrong but here's my latest approach: github.com/MarcinusX/flutter_stripe_demo/blob/master/lib/checkout/stripe_checkout_mobile.dart#L70
The "Server" is something that should be done in the real server (backend), not in the mobile app. Your secret key should never be close in your mobile app.
@@fidev-makebeautifulapps1498 Yeah so why don't you show how to do this in a real live situation cos people don't understand when you say "must be done in the backend".
@@ernestdesbordes Because then I would also introduce the basics of backend development in this video which is something I didn't intend to do. If you want, you can check my Stripe on Web video where I use client-only integration which doesn't have a "Server workaround". th-cam.com/video/yYxIWEQgOe4/w-d-xo.html
@@marcinszaek7564 Alright great...sure...it was next on my list...I really appreciate your tutorials...nice one. Have you tried Brain Tree yet? Not sure if it will be same as Stripe API
Hi there! I have trouble following you. When I use WebView() i get following error: Unhandled Exception: PlatformException(error, java.lang.IllegalStateException: Trying to create a platform view of unregistered type: plugins.flutter.io/webview. Even if I use just something like this: WebView(initialUrl: 'flutter.dev') I get error. I'm using 1.22.6 version of Flutter and 1.0.7 version of webview_flutter. I can not use the newest version because I get way too many errors to fix. I saw this question stackoverflow.com/questions/55794348/webview-in-flutter-not-working-getting-a-platform-error but nothing has worked for me. Do you maybe have an idea why I get this error ? Keep up with great work !
Hey folks! Some of you mentioned that what I showed you in the video doesn't work for Stripe live, and I am sorry to say that it is true.
HOWEVER! There is an easy solution to that, basically, we need to have our simple HTML deployed on the Https website and it will still work!
I've put the same HTML in a repository (github.com/MarcinusX/test1/blob/main/index.html) and deployed it on GitHub pages (marcinusx.github.io/test1/index.html) and it worked on live! I've just paid myself 2 PLN :D I'm sorry for not checking it on live before publishing. Let me know if it works for you.
Thank you for mentioning and its working now 🙂
You prolly dont care but if you guys are stoned like me during the covid times you can watch pretty much all the latest series on InstaFlixxer. Have been watching with my gf for the last couple of months xD
@Avery Salvador definitely, I have been using instaflixxer for since november myself :)
@Avery Salvador yup, I have been watching on InstaFlixxer for since november myself :D
@Avery Salvador Definitely, I've been watching on InstaFlixxer for since december myself :)
Awesome to see you making video content. You have so much valuable knowledge to share!
Big thanks so far (from this beginner). Stripe have done an excellent job of improving the introductory documentation, but then the reader seems to be cast straight into API details. An explanatory step was missing and you seem to have provided it. I think it was a good idea to include the sort of thing one will be doing server-side with a simple local class, which gives one confidence to go ahead and complete the actual server code. Great stuff.
We don't need to pass session id, we can directly pass the checkout url, that we get from the response from the server. BTW a great tutorial was looking for this for a long time, as the new flutter stripe package is in beta, and has a lot of bugs. I am happy I have found this video
Hi there! Thanks for the tutorial. Is there any way to show the Google Pay/Apple Pay button that comes out of the box of Stripe Checkout?
Thank you! i tried to do this for 2 days and found the solution in this video! I'm happy now!)
Thanks for the video man, today there are flutter packages available and you can use them. But this video is helpful if you wanna use any payment gateway with webview. Thanks again
Theres no need to return sessionId and inject JS into the flutter app. You also have access to the session URL and you can just open that in a webview
How did the $priceId get translated into $49.99 value? Normally the backend should retrieve it from the DB, but I don't see it in the code.
Can you please also do a video on 2checkout with flutter?
Can you start a flutter tutorial series for absolute beginners in the field
starting from Basic to intermediate to advance to production level ?
This doesn't work since webview uses s and stripe checkout is not supported in s. Are there any alternatives?
Kindly, Is this Stripe , Free to use . ? and how to link to bank account for ex.
Amazing tutorial. But I am wondered is there way to save input about card somehow and do not input every time.
Thanks a lot 😍♥️...
Can you make a video for push notification without Firebase 😅
Hmm... I don't know how to do it yet but I will note it down. :)
@@fidev-makebeautifulapps1498 😍😍
Can't wait. 😃
Is there a way to get the transaction id with the success callback?
hi.
will you please tell me about e-wallet and stripe topup? i want to add E-wallet feature in my flutter app.
Thank you!
Hey bro can you do full scratch e-commerce app with php/mysql api as backend?
I don't know php so that for sure no. But maybe at some point I could do an e-commerce app :)
@@marcinszaek7564 cools
Error when using live keys
Uncaught IntegrationError: Live Stripe.js integrations must use HTTPS.
same error with live mode
@@rawquesh I searched but didn't got any solution , so made seperate html page and hosted in firebase , got the https URL then replaced the URL in code
@@rockeypandit2500 is that working now?
@@rockeypandit2500 if yes then could you please give me a demo code of HTML and function both, thank you
@@rawquesh sure share me ur email
how to customize stripe UI?
Hi sir, good to see you again,
how are you?
Hi, thanks! I'm good :)
@@marcinszaek7564 thanks for the video sir ❤️
how to add monthly subscription Function with stripe method in flutter ?
kindly help me i am stuck at this function
i will be thankful to you !
I think there is an option there in Stripe Dashboard to make price recurring.
What is const nikesPriceId = 'price_XXX'; and where should I find it in stripe?
Nikes are the example product I created in Stripe dashboard. You can create any product you want to sell and then just use the id of it :)
Sir how to have transaction id of payment ?
How to get the id of the variable "nikesPriceIden"? my "stripe" panel I only have the public and private key, but I don't have the "nikesPriceId" help
Nikes are the example product I created in Stripe dashboard. You can create any product you want to sell and then just use the id of it :)
@@fidev-makebeautifulapps1498 THANK YOU!
hello sir can you please say that what's the best way to hide API keys in the app
Hide from who? :)
@@fidev-makebeautifulapps1498 Someone who can decompile the app which may expose the code up-to an extent.(But reverse engineering is kind-off tough to do with flutter app so it's not a problem)
Thanks
error when using live mode
"Uncaught IntegrationError: Live Stripe.js integrations must use HTTPS. For more information: stripe.com/docs/security/guide#tls", source: js.stripe.com/v3/ (1)
When do you get this error?
@@fidev-makebeautifulapps1498 after getting session-id and loading the local html
@@fidev-makebeautifulapps1498 you just use live keys with that code and you will know it
@@rawquesh Correct! See the pinned comment for the solution :)
how to get back transaction-id after payment successful
You can have checkout session id in the success URL. From that you'd have to ask backend for the product details based on that id. See stripe.com/docs/payments/checkout/custom-success-page#modify-success-url for example
@@fidev-makebeautifulapps1498 I got it but I can't see any endpoint for getting transaction id by session-id, can you please help me out 😟
@@bishnoi0072 What info do you need exactly that is not in the session object?
@@fidev-makebeautifulapps1498 i'm actually using woocommerce rest api so i have to put the transaction id in the payment receipt so i need to have transaction id
@@fidev-makebeautifulapps1498 thank you btw i got it, the transaction id we can have from that same session request. 🙂
Hello sir. how to get "nikesPriceId" into my own backend and just pay with stripe
It's a product id created in Stripe dashboard. Once you create the product, you can save the id in the backend :)
@@fidev-makebeautifulapps1498 . sorry but i don't understand well. imagine that i'm in my ecommerce website and want to save the price of any article. what can i do ? according to your method, it will be always the same price ?
my question is how can i do to set "nikesPriceId" for any product in my backend. please more explication sir.🙏
Does this implementation allow for autofill and the other Stripe checkout benefits?
Yes, and Google Pay and Apple Pay as well :)
@@fidev-makebeautifulapps1498 cool
Just to check again (since I am seemingly dumb). On mobile via webview this supports
Address auto-complete
Real-time card validation
Descriptive error messages
Third-party autofill
Card brand identification
Right? :D
@@lassediercks4766 As far as I know, mostly yes. It doesn't collect address though and I don't know what you mean by third-party autofill. The whole idea of Stripe Checkout is that Stripe handles all of those things. The best bet is to go to stripe.com/en-gb/payments/checkout and see if it fits your needs. :)
EDIT: Oh, you got it from their website! So yeah, I don't see why it should not work in the webview :)
@@fidev-makebeautifulapps1498 thank you - we'll test it out! Great work on the videos and blog posts.
@@fidev-makebeautifulapps1498 hi we tried doing this on mobile but it seems that webview on mobile cannot access device autofill information. Does it rly work for you it might be we made a mistake? Br Lasse
Do you have a solution to those errors in the end?
From what I understood, this error is happening because evaluateJavascript method doesn't return anything. So I don't think it actually is an error worth handling. Of course I may be wrong but here's my latest approach: github.com/MarcinusX/flutter_stripe_demo/blob/master/lib/checkout/stripe_checkout_mobile.dart#L70
@@fidev-makebeautifulapps1498 Awesome, that worked, my editor kept pausing the sim when the error appeared so it's nice to have it fixed, thank you.
Umm I didn't get the "don't add this to your real app this is just for demo purposes" part.
The "Server" is something that should be done in the real server (backend), not in the mobile app. Your secret key should never be close in your mobile app.
@@fidev-makebeautifulapps1498 Yeah so why don't you show how to do this in a real live situation cos people don't understand when you say "must be done in the backend".
@@ernestdesbordes Because then I would also introduce the basics of backend development in this video which is something I didn't intend to do. If you want, you can check my Stripe on Web video where I use client-only integration which doesn't have a "Server workaround". th-cam.com/video/yYxIWEQgOe4/w-d-xo.html
@@marcinszaek7564 Alright great...sure...it was next on my list...I really appreciate your tutorials...nice one. Have you tried Brain Tree yet? Not sure if it will be same as Stripe API
@@ernestdesbordes Not yet :)
Hi there!
I have trouble following you. When I use WebView() i get following error:
Unhandled Exception: PlatformException(error, java.lang.IllegalStateException: Trying to create a platform view of unregistered type: plugins.flutter.io/webview.
Even if I use just something like this: WebView(initialUrl: 'flutter.dev') I get error.
I'm using 1.22.6 version of Flutter and 1.0.7 version of webview_flutter.
I can not use the newest version because I get way too many errors to fix.
I saw this question stackoverflow.com/questions/55794348/webview-in-flutter-not-working-getting-a-platform-error but nothing has worked for me.
Do you maybe have an idea why I get this error ?
Keep up with great work !