Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Some questions (HELP 😭 ) #23

Open
andreslora opened this issue May 26, 2021 · 16 comments
Open

Some questions (HELP 😭 ) #23

andreslora opened this issue May 26, 2021 · 16 comments

Comments

@andreslora
Copy link

Hi,

So, I have a project with a deadline for this next monday 😆 and I haven't integrated stripe yet. I think this plugin accomplishes all I need but I am having some difficulties trying to set it up properly.

When I try to use the stripeElementsForm component, I am getting this:

Screen Shot 2021-05-26 at 6 50 13 PM

Am I missing a CSS or something like that?

Also, is just a credit card field enough to get a subscription? I thought I would need something like this:

Screen Shot 2021-05-26 at 6 52 31 PM

Would it be possible to get in touch with you through slack, telegram, discord, or any channel where I could bother you a bit with some questions? This is a rush and I'd love to have some quick answers (I swear I won't bother you a lot).

NOTE: I have already set up the raindlab user plugin and all that. Now I need to allow those users to pay a monthly subscription, if they are not subscribed they will be redirected to a payment page.

Please, Help 😭

@tobias-kuendig
Copy link
Member

Check your JS console, do you get any errors? Also, did you set the includeStripeJs and ìncludeCss properties to true?

https://github.com/OFFLINE-GmbH/oc-cashier-plugin/blob/master/components/StripeElementsForm.php#L44

@andreslora
Copy link
Author

Hi,

There's a listener error:

Screen Shot 2021-05-27 at 9 10 17 AM

Screen Shot 2021-05-27 at 9 10 22 AM

And I am setting JS and CSS like this in the plugin component:

Screen Shot 2021-05-27 at 9 07 45 AM

@andreslora
Copy link
Author

andreslora commented May 27, 2021

The JS error is because I am not passing the cost of the subscription I think, but I am not sure where should I define it.

@tobias-kuendig
Copy link
Member

Do you have any other plugins installed? The code that generates the error does not look related to this plugin (if you search the repo there is no createCheckoutSession function anywhere).

@andreslora
Copy link
Author

My bad, It was me trying to set up stripe by myself and I forgot to delete the code.

Now I do not have any errors but still getting this:

Screen Shot 2021-05-27 at 9 57 51 AM

The CSS and JS:

Screen Shot 2021-05-27 at 9 58 34 AM

Also I have those options checked in the component settings.

@tobias-kuendig
Copy link
Member

Do you have a {% scripts %} placeholder somewhere on your layout? This is required so the JS can be loaded.
https://octobercms.com/docs/markup/tag-scripts

Check your page source if you can see this code (once the placeholder is added to the layout):
https://github.com/OFFLINE-GmbH/oc-cashier-plugin/blob/master/components/stripeelementsform/script.htm#L9

@andreslora
Copy link
Author

andreslora commented May 27, 2021

Yes I do:

Screen Shot 2021-05-27 at 10 35 26 AM

If i check the source this is what I see:

Screen Shot 2021-05-27 at 10 37 40 AM

@tobias-kuendig
Copy link
Member

Alright, then start debugging. Add some console.logs or use your brower's script debugger.

Check to see if the elements var gets populated (this means Stripe is loaded) and see if the #card-element in your DOM is being replaced. You should see a error somewhere or at least be able to find out where the script stops working.

@andreslora
Copy link
Author

The #card-element has an iframe and It's been loaded:

Screen Shot 2021-05-27 at 12 14 32 PM

Screen Shot 2021-05-27 at 12 15 18 PM

I am not getting an error =/

@tobias-kuendig
Copy link
Member

So everything seems to be working as expected, but for some reason the iframe is invisible. Please check that no browser extension is removing the frame. Also disable any CSS styles that might interfere with the iframe.

According to your screenshot above everything is working fine

@andreslora
Copy link
Author

You're right, my css is not working properly with the iframe. I disabled my css and now I can put the credit card, expiration date and zip code, but when I hit the pay with card button, it returns an empty array, I am using a test credit card from https://stripe.com/docs/testing#regulatory-cards

Screen Shot 2021-05-27 at 6 54 15 PM

@andreslora
Copy link
Author

Also I am wondering, how to specify the subscription price? I mean in Stripe Dashboard I set up a product (which is a subscription) but I'm confused about how to set it up with the plugin, also there are some special things the website that needs extra payment, for example, subscribed users can download anything but special songs if they want those special songs they have to single pay for them.

@tobias-kuendig
Copy link
Member

Also I am wondering, how to specify the subscription price?

AFAIK you set that on Stripe's end by creating a product. As for how to assign it to a user, check out Laravel Cashier's docs (this plugin is just a wrapper around it):
https://laravel.com/docs/8.x/billing#creating-subscriptions

The code from the docs could be executed in the offline.cashier::stripeElementForm.submit event listener as described in the README.

subscribed users can download anything

You can easily check if a user has a subscription by calling $user->subscribed('your-subscription'). There is also the needsSubscription componenent to block access to a certain page.

if they want those special songs they have to single pay for them.

Single charges are supported by Cashier as well: https://laravel.com/docs/8.x/billing#single-charges

@andreslora
Copy link
Author

Thank you, I am working on what you said.

Why the ends_at field is empty? even with a successful subscription?

Is the subscription needed component validating that the payment was successful? Because I created a subscription with pending payment, and I was allowed to navigate to a restricted area.

@andreslora
Copy link
Author

I think I have to modify this event offline.cashier::subscription.check but I am not pretty sure how to specify that only return true with succesful payments.

How can I access to the payment error, so I can tell the user what happened?

@tobias-kuendig
Copy link
Member

Why the ends_at field is empty? even with a successful subscription?

IIRC this is used if the user has cancelled the subscription. Empty = the subscription is active and not cancelled.

Is the subscription needed component validating that the payment was successful? Because I created a subscription with pending payment, and I was allowed to navigate to a restricted area.

We simply redirect the call to Cashier's subscribed method, so you would have to check there if pending payments are considered as a "valid subscription":

https://github.com/OFFLINE-GmbH/oc-cashier-plugin/blob/master/components/NeedsSubscription.php#L48

How can I access to the payment error, so I can tell the user what happened?

You can use the webhook events to react to failed payments:
https://github.com/OFFLINE-GmbH/oc-cashier-plugin#handle-stripe-webhooks

For example:

        Event::listen('offline.cashier::stripe.webhook.invoice.payment_failed', function ($payload, $request) {
            $subscription = $payload['data']['object']['subscription'];
            try {
                $user = User::fromSubscriptionId($subscription);
                // Do something with $user
            } catch (\Exception $e) {
                // do nothing.
            }

            logger()->error('Payment failed', compact('user', 'payload'));
        });

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants