Razorpay checkout form stuck on loading in webview

user_12693508 0
Viewed 2400

I have a webpage with Razorpay integrated and I want to use it in webview app. Everything works fine but when I select a payment method in razorpay form, it is stuck on loading and never opens the next screen where it asks whether to make it successful or fail (test mode).

Code:

var options = {
            "key": "rzp_test_UIYCZTZXgkmZtu",
            "amount": (totalAmount*100).toString(), // Amount is in currency subunits. Default currency is INR. Hence, 50000 refers to 50000 paise
            "currency": "INR",
            "name": "test payment :)",
            "description": "Test Transaction",
            "image": Logo,
            "order_id": res.data.orderID,
            "handler": function (response){
                alert("payment successful! :)")
            },
            "prefill": {
                "name": "xyz",
                "email": "xyz@abc.com",
                "contact": "000000000"
            },
        }
        const paymentObject = new window.Razorpay(options)
        paymentObject.open()

It works in website but not in web view. Am I missing something?

razorpay reactjs node.js webview android
1 Answers

Here is a partially working solution. The main problem is that the Razorpay dialog tries to open a new window to show the success / failure, and your webview is not allowing new windows to open.

On Android the following helps:

myWebView.getSettings().setSupportMultipleWindows(true);
myWebView.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);

If you would rather open the window in a separate webview, try this: https://stackoverflow.com/a/27010225/583875

or in a separate browser, try this: https://stackoverflow.com/a/49029609

user_5838750
Related