iroh-react-error | Stripe Developers | Page 1

elder daggerBOT Nov 29, 2022, 3:54 PM

#

pale cosmos Nov 29, 2022, 3:58 PM

#

What kind of request are you making when this happens?

#

You likely need to implement a CORS policy for your back end

reef olive Nov 29, 2022, 4:04 PM

#

I did.

reef olive Nov 29, 2022, 4:04 PM

#

pale cosmos What kind of request are you making when this happens?

    origin: ['https://stage-front.eidverse.io', 'http://localhost:3000'],
    methods: ['GET','POST','DELETE','UPDATE','PUT','PATCH'],
    allowedHeaders:["Origin, X-Requested-With, Content-Type, Accept, Authorization, access-control-allow-origin"],
    credentials: true,
}));```

pale cosmos Nov 29, 2022, 4:10 PM

#

I'm not sure I understand how the stack overflow question is related, but if you're having CORS issues you'll need to carefully review that config for you request

#

What is the request that hits the CORS error?

#

If I recall, I don't think multiple origin values work like you've shown here, and you can try putting a single origin to determine if that helps

reef olive Nov 29, 2022, 4:18 PM

#

import {Message} from '../resources/text'


export const payBill = async (payment_item) =>{

    var responseData
    const config = {
        headers: { 'Authorization': 'Bearer ' + Message.cookey_key,'Content-Type': 'application/json' },
      };
      await SuperAppApi.post(`/payment`,payment_item,config).then((res)=>{


         responseData = res.data
         console.log(res)
         //console.log(res.data[0]+" cal ki hoi na !!! , , ,!"+res.data)

    }).catch((err)=>{ console.log(err," error")})

    return responseData

}``` front end

reef olive Nov 29, 2022, 4:19 PM

#

pale cosmos If I recall, I don't think multiple `origin` values work like you've shown here,...

multiple origin is working for signup signin and profile_fetching, but I have used signle origin as well. Didn't work

pale cosmos Nov 29, 2022, 4:23 PM

#

OK and how exactly do you see Stripe as involved for this?

#

If this is your client app making a request to your API and hitting a CORS error, you're going to need to debug that, trace what happens, when and why.

reef olive Nov 29, 2022, 4:27 PM

#

Because when I commented out stripe functions, it worked just fine and no errors occurred.
So it is highly likely some configuration settings that is required by stripe payment function at times when stripe functions are called from aws lambda.

pale cosmos Nov 29, 2022, 4:29 PM

#

Which function? What is your /payment endpoint doing?

reef olive Nov 29, 2022, 4:29 PM

#

    console.log("payment started 2",user,process.env.STRIPE_SECRET_TEST)
    
    console.log("payment started 3",customer_res)
    let customer_id 
   
        customer_id = await createStripeCustomer(user)
    
    console.log(user," user amount")
    try{
        console.log("paymen 4.5",customer_id)
    const payment = await stripe.paymentIntents.create({
        amount:user.amount,
        currency: "USD",
        description: "Test Marketplace",
        customer:customer_id,
        payment_method: user.id,
        confirm: true
    })
    console.log("payment 5",payment)
}
catch(err){
    console.log("payment 5",err)
}
   

    
}

const createStripeCustomer = async (user) =>{
    console.log("payment 4",user)
    
        let customer_info = {
            name: user.username,
            email:user.email
        }
        let customer = await stripe.customers.create(customer_info)
    
        await CustomerService.postCUstomer(user,customer.id)

        
        return customer.id
    

}```

reef olive Nov 29, 2022, 4:30 PM

#

pale cosmos Which function? What is your `/payment` endpoint doing?

nothing is console logged after this -'console.log("payment started 3",customer_res)'

pale cosmos Nov 29, 2022, 4:31 PM

#

Have you tried putting a try/catch around createStripeCustomer()?

reef olive Nov 29, 2022, 4:32 PM

#

yes, did. But nothing was cosole logged.

#

I even commented out createStripeCustomer()? this. Still nothing.

pale cosmos Nov 29, 2022, 4:34 PM

#

But you say the endpoint works with both Stripe parts removed?

#

Does the stripe client return any errors?

#

Can you show how the stripe client is imported and initialized?

reef olive Nov 29, 2022, 4:35 PM

#

no that part worked fine.

pale cosmos Nov 29, 2022, 4:35 PM

#

It doesn't appear you've initialized stripe with your key, there

reef olive Nov 29, 2022, 4:39 PM

#

import { Elements } from "@stripe/react-stripe-js"
import { loadStripe } from "@stripe/stripe-js"
const stripeTestPromise = loadStripe(PUBLIC_KEY)
<Elements stripe={stripeTestPromise}>
            <PaymentForm setProgressbar={props.setProgressbar}  dispatch={props.dispatch} toast={props.toast}/>
        </Elements>```
payment form

import { CardElement, useElements, useStripe } from "@stripe/react-stripe-js"
...
const stripe = useStripe()
...
const {error, paymentMethod} = await stripe.createPaymentMethod({
type: "card",
card: elements.getElement(CardElement)
})

#

Payment Form

import { useSelector } from "react-redux";
import React, { useState } from 'react'
import { Spacer } from "@nextui-org/react";
import { Colors } from "../../resources/Color"
import '../../styles/navbar.css';
import {pay} from '../../funtions/stripeFunction'
import {fetchUpdatedData} from '../../redux/user/userInfoAction'
import { Toaster } from "react-hot-toast";

const CARD_OPTIONS = {

    
    

    iconStyle: "solid",
    style: {
        base: {
            iconColor: "#c4f0ff",
            color: Colors.greenThemeColor,
            backgroundColor:'white',
            fontWeight: 500,
            fontFamily: "Roboto, Open Sans, Segoe UI, sans-serif",
            fontSize: "16px",
            fontSmoothing: "antialiased",
            ":-webkit-autofill": { color: "#f00" },
            "::placeholder": { color: Colors.disabled }
        },
        invalid: {
            iconColor: "#ffc7ee",
            color: "#ffc7ee"
        }
    }
}```

#

    const userData = useSelector((state) => state.userData)
    const [success, setSuccess ] = useState(false)
    const stripe = useStripe()
    const elements = useElements()
    const[amount,setAmount] = useState()

    const handleSubmit = async (e) => {
        console.log(amount," amount")
        if(!amount || !userData.isConnected){
            console.log(" amount ")
            return
        }
        props.setProgressbar('visible')
        e.preventDefault()
        const {error, paymentMethod} = await stripe.createPaymentMethod({
            type: "card",
            card: elements.getElement(CardElement)
        })


    if(!error) {
        try {
           
            const {id} = paymentMethod
            let item = {
                amount: amount*100,
                id,
                asset:1,
                email:userData.userInfo.id,
                username:userData.userInfo.alias
            }
            console.log(item," itemmmmmm ")
            let response //= await pay(item,props.toast,props.dispatch)
            
            console.log(response," response asheb moja hobe")
            if(response.success) {
                console.log("Successful payment")
                props.dispatch(fetchUpdatedData(userData.userInfo,response.updatedAsset))
                props.setProgressbar('hidden')
                
                
            }

        } catch (error) {
            props.setProgressbar('hidden')
            console.log("Error", error)
        }
    } else {
        console.log(error)
        props.setProgressbar('hidden')
    }
}```

#

        <>
       
        <div>
        <form>
            <fieldset className="FormGroup">
                <div className="FormRow">
                    <input type="number" value={amount} placeholder="EIDD Amount" onChange= {e=> setAmount(e.target.value)} />
                    <Spacer y={1.3}/>
                    <CardElement options={CARD_OPTIONS}/>
                </div>
            </fieldset>
            
            
           
        </form>
        <div className="flex justify-center addUsername">
            <button onClick={handleSubmit}>Pay</button>
        </div>
        </div>
            
        </>
    )
}```

pale cosmos Nov 29, 2022, 4:44 PM

#

Thanks for share

#

Can you also share where you import &n initialize on your server endpoint?

#

I only see client-side code in the blocks just above this

reef olive Nov 29, 2022, 4:47 PM

#

const { createCustomer } = require("../Models/customerModel")
const CustomerService = require('./CustomerService')





exports.pay = async (user) => {
    console.log("payment started 2",user,process.env.STRIPE_SECRET_TEST)
    customer_res = await CustomerService.findCustomer(user)
    console.log("payment started 3",customer_res)
    let customer_id 
    if(customer_res.length<=0)
        customer_id = await createStripeCustomer(user)
    else
        customer_id = customer_res[0].customer_id
    console.log(user," user amount")
    try{
        console.log("paymen 4.5",customer_id)
    const payment = await stripe.paymentIntents.create({
        amount:user.amount,
        currency: "USD",
        description: "Test Marketplace",
        customer:customer_id,
        payment_method: user.id,
        confirm: true
    })
    console.log("payment 5",payment)
}
catch(err){
    console.log("payment 5",err)
}
   

    
}

const createStripeCustomer = async (user) =>{
    console.log("payment 4",user)
    
        let customer_info = {
            name: user.username,
            email:user.email
        }
        let customer = await stripe.customers.create(customer_info)
    
        await CustomerService.postCUstomer(user,customer.id)

        
        return customer.id
    

}```

reef olive Nov 29, 2022, 4:47 PM

#

pale cosmos Can you also share where you import &n initialize on your server endpoint?

you mean this right?
Btw it all worked in the localhost.

pale cosmos Nov 29, 2022, 4:47 PM

#

ok thanks, yes

#

Ok initialization looks fine, so I really can't say why you're hitting a CORS error, especially why that would appear conditionally when including Stripe calls. You're going to have to debug this and identify exactly what triggers it, and ideally be able to share a small reproduction with us if you believe it to be an issue with the stripe-node client.

simple robin Nov 29, 2022, 4:57 PM

#

iroh-react-error

reef olive Nov 29, 2022, 5:13 PM

#

Tried almost everything. I have an impression that this is a configuration issue.

#

btw client side request works.

simple robin Nov 29, 2022, 5:14 PM

#

I think we need more details here. Like an exact page where we can reproduce.

reef olive Nov 29, 2022, 5:20 PM

#

https://stackoverflow.com/questions/49083151/why-stripe-api-is-not-working-on-live-website

Would you please look at the question?
It is similar to mine. Could you explain what I need to do according to my context.

You can reproduce https://stage-front.eidverse.io/loadup

First you have to sign up though.

simple robin Nov 29, 2022, 5:24 PM

#

is this expected on load?

reef olive Nov 29, 2022, 5:29 PM

#

Since it is just for testing we did not fix this.

simple robin Nov 29, 2022, 5:31 PM

#

Can you give clear instructions to repro exactly? I tried to fill the form, nothing happens when I press Pay

reef olive Nov 29, 2022, 5:36 PM

#

Okay first you have input in the amount field.
Amount - 1
Card -4242 4242 4242 4242
Cvc-123
Zip-12345
You press pay
A loading animation shoul be displayed.
And then it will be gone

#

If you open up the dev console. You will see cors error

simple robin Nov 29, 2022, 5:36 PM

#

but it doesn't, nothing happens when I press pay

#

reef olive Nov 29, 2022, 5:37 PM

#

Did you sign in?

simple robin Nov 29, 2022, 5:37 PM

#

I just asked for clear instructions :p

reef olive Nov 29, 2022, 5:37 PM

#

Email - asdy@gmail.com
Password - asdy

#

Please sign in first.

simple robin Nov 29, 2022, 5:38 PM

#

okay so what part of your code fires the CORS error?

reef olive Nov 29, 2022, 5:40 PM

#

When you press pay. One /paymeny api is hit.
It works fine initially but then when it reaches to the point of payment creation it suddenly stops working

#

my controller

const AssetsService = require('../Service/AssetService')
const PaymentService = require('../Service/PaymentService')


exports.paywithcard = async (req,res,next) =>{
    //await UserService.createUser({"id":req.authData.verifiedAddress,"alias":req.authData.verifiedAddress},next) 
    console.log(req.body," payment started 1")
    try{
      
       await StripeService.pay(req.body)
       
       
       console.log(req.body," payment started 7")
        res.json({
            message: "Payment successful",
            success: true,
            
        })
    }
    catch(err){
        console.log(err," user err")
        if(!err.statusCode)
            err.statusCode = 500;
        next(err);

    }
};```

#

stripe service

const { createCustomer } = require("../Models/customerModel")
const CustomerService = require('./CustomerService')





exports.pay = async (user) => {
    console.log("payment started 2",user,process.env.STRIPE_SECRET_TEST)
    
    console.log("payment started 3",customer_res)
    
   
        
    
    console.log(user," user amount")
    try{
        console.log("paymen 4.5",customer_id)
    const payment = await stripe.paymentIntents.create({
        amount:user.amount,
        currency: "USD",
        description: "Test Marketplace",
        customer:user.customer_id,
        payment_method: user.id,
        confirm: true
    })
    console.log("payment 5",payment)
}
catch(err){
    console.log("payment 5",err)
}
   

    
}```

#

console.log("paymen 4.5",customer_id)-> last console log point. nothing is console logged after that.

#

but if I comment out this stripe.paymentIntents.create({ amount:user.amount, currency: "USD", description: "Test Marketplace", customer:user.customer_id, payment_method: user.id, confirm: true }) , it works

simple robin Nov 29, 2022, 5:44 PM

#

sorry that's a ton of code dumped on me

#

like the PI creation is irrelevant, it happens server-side where CORS doesn't matter at all

#

can you maybe log user.customer_id and user.id cleanly before that?

reef olive Nov 29, 2022, 5:57 PM

#

Sure

#

But why do you think paymenIntents is irrelevant.
Before this part all other lines are executed

#

Only when the flow reached pi, it gets stopped.

simple robin Nov 29, 2022, 5:58 PM

#

a CORS error happens client-side in the browser when trying to do a request. If the CORS error is the problem, it stops the request completely from going out, so you'd never reach the server-side code.

If the problem is the server-side code itself, then the CORS error is a red herring

reef olive Nov 29, 2022, 6:00 PM

#

Since it has reached the server and went to the stripeService.js file, we can say then it is definitely a server side error, right?

#

Could you tell me again which part of code you exactly want to review?

simple robin Nov 29, 2022, 6:03 PM

#

Well right now I don't know, it's been a long discussion with a ton of code shared and it was all focused on the CORS error

#

If you are confident that the issue happens server-side, then I would like the exact values of the customer and payment_method parameters

reef olive Nov 29, 2022, 6:07 PM

#

asset: 1
email: "asdy@gmail.com"
payment_ethod: "pm_1M9YCcC1WQEQxJQoWKD85gEH"
username: "asdy"```

#

you can see it from here. Id is basically payment_method

simple robin Nov 29, 2022, 6:08 PM

#

But that's a client-side log

#

many devs mix ups variables or obvious bugs

#

please log exactly what you are sending to the PaymentIntent create API server-side before that call

reef olive Nov 29, 2022, 6:13 PM

#

  id: 'pm_1M9YCcC1WQEQxJQoWKD85gEH',
  asset: 1,
  email: 'asdy@gmail.com',
  username: 'asdy'``` from backenfd
fyi- it all worked in the local, so if there is chance of variables being mixed up, it wouldn't have worked in the local.

simple robin Nov 29, 2022, 6:13 PM

#

I'm sorry but that's not what I asked

#

where is the customer parameter?

#

Please ignore user and log exactly every parameter your code is passing to the PaymentIntents create call

reef olive Nov 29, 2022, 6:16 PM

#

okay.

#

        amount:100,
        currency: "USD",
        description: "Test Marketplace",
        customer:'cus_MtDG2uVJrfV5Y0',
        payment_method: 'pm_1M9YCcC1WQEQxJQoWKD85gEH',
        confirm: true```

simple robin Nov 29, 2022, 6:22 PM

#

okay so I don't see you pass pm_1M9YCcC1WQEQxJQoWKD85gEH at all in our logs in the past 24 hours. @robust schooner is taking over now but mostly it looks like this line of code is either never called or never reaches Stripe at least

reef olive Nov 29, 2022, 6:23 PM

#

It is called but never reached Stripe.

#

all the payment done when the code was running in localhost.

robust schooner Nov 29, 2022, 6:28 PM

#

👋

#

Catching up

reef olive Nov 29, 2022, 6:32 PM

#

https://stackoverflow.com/questions/49083151/why-stripe-api-is-not-working-on-live-website
Hi
Can you pleade look at it?
I think my problem is similar to this. But the solution I didn’t understand.

robust schooner Nov 29, 2022, 6:38 PM

#

Hmmm yeah nothing is jumping out to me here...

#

Looking more

robust schooner Nov 29, 2022, 6:57 PM

#

Alright think I'm caught up

#

Very strange

#

Can you do something like

        amount:user.amount,
        currency: "USD",
        description: "Test Marketplace",
        customer:user.customer_id,
        payment_method: user.id,
        confirm: true
    })
console.log(result)```

reef olive Nov 29, 2022, 7:14 PM

#

I did that. But it never reached console.log(result)

#

        amount:user.amount,
        currency: "USD",
        description: "Test Marketplace",
        customer:user.customer_id,
        payment_method: user.id,
        confirm: true
    })
    console.log("payment 5",payment)```
This is my code

robust schooner Nov 29, 2022, 7:16 PM

#

Ah missed that

#

Hmmm so you are within the endpoint but the Stripe request never triggers

reef olive Nov 29, 2022, 7:17 PM

#

I still feel that it is an internal configuration error.

#

Do I ahve to add any script anywhere? Or is it a https /http issue. It could be test_more issue or maybe some security issue

#

what do you think?
I t already been 23hrs and I am stuck at a same place. Not sure what is the issue.

robust schooner Nov 29, 2022, 7:22 PM

#

Yeah really hard to say

#

It also feels to me like a config issue

#

I don't really understand how you aren't seeing any error in your server logs in this case

#

Might be worth reaching out to AWS Lamda to see if there is any further debugging you can do there.... I don't know much about Lamda myself

reef olive Nov 29, 2022, 7:25 PM

#

but I have seen lot of post on different social platform, that people faces this issue at some point using stripe. So I thought there would be a very common solution for that.

robust schooner Nov 29, 2022, 7:26 PM

#

As noted above, the CORS error here looks to be a red-herring as far as I can tell. It would not happen in your Server-side code.

reef olive Nov 29, 2022, 7:30 PM

#

This is very frustrating.
Thanks for your help.
But if you find anything, any past mentioned issue relating aws and stipe please do let me know.

#

quick question - I have printed the stripe in backen. There I saw port is 443. What does it mean? It hits aws at 443 or my backend hit stripe server at 443?

#

Also can I change the port?

robust schooner Nov 29, 2022, 7:43 PM

#

Yeah that is your backend trying to hit Stripe API at 443.

#

It is possible that your server blocks this port

#

Let me check on whether you can override this to test

#

Yep so try to set a different port: https://github.com/stripe/stripe-node#configuration

reef olive Nov 29, 2022, 7:47 PM

#

thnaks. let me try

pale cosmos Nov 29, 2022, 7:54 PM

#

Let us know what happens 🙂

#

Another test you can try would be using something like node-fetch to make a request to https://api.stripe.com/healthcheck to test connectivity from your lambda
https://www.npmjs.com/package/node-fetch#common-usage

reef olive Nov 29, 2022, 8:11 PM

#

I user port 123, didn't work. Okay trying this node fetch.

reef olive Nov 29, 2022, 9:34 PM

#

Fyi - aws lambda is not a live server. It only interacts when an api hits.

But I think stripe expects to be run in a live server. (Not sure though)

So is there a way I can run in on a not live server.

pale cosmos Nov 29, 2022, 9:35 PM

#

The Stripe client doesn't really know how its being run -- you can run a short js script using it and it should work

#

Have you been able to determine if your lambda is able to make outbound requests & reach Stripe's API servers?

#

Is it possible you're hitting something like a short timeout on the lambda?

#iroh-react-error