When integrating with Standard Checkout, you can also pass a callback_url for redirection-based flow. If popup creation fails for some reason, the browser is redirected to an external page (bank/3D secure page) for customers to fill in OTP/PIN. At the end of the payment, the control is returned to the callback_url previously created by you on which the payment results will be submitted.
If you reuse your web integration of Razorpay Checkout inside a web view on iOS, the Checkout Form may not open.
However, in certain scenarios, you might want to reuse web integration in a mobile app. You can do so by passing the callback_url along with other checkout options to process the desired payment.
var options = {
...
callback_url: 'https://your-server/callback_url',
redirect: true
}
The script that the callback_url points to should handle incoming POST requests. The callback URL will have razorpay_payment_id for all successful payments.
If your server is integrated with Orders API,razorpay_order_id and razorpay_signature are returned in the Request body. To learn about Orders API, refer to our
.
Handy Tips
You can set query parameters with callback_url to map it with entities at your end. An example of a valid callback URL: https://your-site.com/callback?cart_id=12345.
error | Always present | |
error [code] | Always present | BAD_REQUEST_ERROR |
error [description] | Always present | Payment failed due to incorrect card number |
error [field] | Present if the payment fails due to basic validation error | card [number] |
If you are loading the Checkout Form directly to the WebView on your native mobile app without using Razorpay iOS SDK, you must provide a callback_url in Razorpay Checkout parameters. After the successful payment, users are redirected to the specified URL.
You can enable the handover control from the page loaded at callback_url to your native app code.
The webpage will be loaded into a WebView class. To communicate anything from the webpage loaded into WebView to native code, you must add a JavaScriptInterface to the webView.
Adding the JavascriptInterface to the webView
webView.addJavascriptInterface("PaymentInterface", new PaymentInterface());
class PaymentInterface{
@JavascriptInterface
public void success(String data){
}
@JavascriptInterface
public void error(String data){
}
}
The JavaScript code loaded into the webView will be able to call native methods of PaymentInterface class by calling PaymentInterface.success() and PaymentInterface.error().
WKWebView framework acts as a bridge between the JavaScript and the native code. UIWebView does not provide this functionality.
The bridge is implemented by passing an instance of WKScriptMessageHandler and a string (which is the name of the bridge).
webView.configuration.userContentController.add(self, name: "PaymentJSBridge")
The instance of WKScriptMessageHandler, which is passed, needs to implement a function userContentController(WKUserContentController, WKScriptMessage). Once the function is implemented, the data is sent by JavaScript and can be retrieved inside the function.
public func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
if let messageBody = message.body as? [AnyHashable:Any]{
}
}
At the JavaScript end, data is sent to the iOS native code by evaluating the following JavaScript.
window.webkit.messageHandlers.PaymentJSBridge.postMessage(messageBody)
Handy Tips
Only the function userContentController can be called from the JavaScript by evaluating the above-mentioned script. The messageBody passed by the script must contain the appropriate data to control the flow of the native code.
