Hello I am having an error implementing PayPal for my practice website. The error is shown below. Code otherwise works unless I click on smart button then leave it sitting. How can I error handle this? I am using react-paypal-button-v2. Button code is also shown here.

STATE CODE

function OrderScreen() {

    ...
    const addPayPalScript = () => {
        const script = document.createElement('script')
        script.type = 'text/javascript'
        // const ClIENT_ID = process.env.REACT_APP_PAYPAL_CLIENT_ID
        script.src = `https://www.paypal.com/sdk/js?client-id=${CLIENT_ID}`
        script.async = true
        script.onload = () => { 
            setSdkReady(true)
        }
        document.body.appendChild(script)
    }
    
    useEffect(() => { 
        if(!order || successPay || order._id !== Number(orderId)) {
            dispatch({type: ORDER_PAY_RESET})
            dispatch(getOrderDetails(orderId))
        } else if (!order.isPaid) {
            if(!window.paypal) {
                addPayPalScript()
            } else {
                setSdkReady(true)
            }
        }
        
        if(error?.includes('token not valid')) {
            dispatch(logout())
            dispatch('login')
        }
    }, [dispatch, order, orderId, error, successPay])

    const successPaymentHandler = (paymentResult) => {
        dispatch(payOrder(orderId, paymentResult))
    }

BUTTON CODE

           {!sdkReady ? (
                                        <Loader />
                                    ) : (
                                        <PayPalButton 
                                            createOrder={(data, actions) => {
                                                return actions.order.create({
                                                purchase_units: [{
                                                    amount: {
                                                    currency_code: "USD",
                                                    value: order.totalPrice
                                                    },
                                                   ...
                                                      }
                                                   
                                                }],
                                                application_context: {
                                                    locale: 'us-US',
                                                    shipping_preference: 'SET_PROVIDED_ADDRESS',
                                                  }
                                            
                                                });
                                            }}
                                            onSuccess={successPaymentHandler}
                                            one rror={(err)=>setErrorPayPal(err)}
                                        />
                                    )}
                                </List

CodePudding user response：

Most likely that 'stats' request is being blocked by some adblock or browser anti-tracking mechanism. Regardless of the specifics it's not a problem, ignore it completely.

Separately, react-paypal-button-v2 is not an official package. Consider using react-paypal-js instead.